2

我正在使用 KineticJS 精灵，但无法找到让它们显示为 HDPI 的方法 - 我尝试使用缩放到一半大小（我的图像是我希望它们出现的大小的 2 倍） - 这使得图像更小使其“更密集”。

我也尝试将精灵的宽度和高度定义为半值，但这些属性似乎没有效果。

任何帮助将不胜感激。继承人和我正在做的事情的例子，我的尝试被注释掉了：

  var stage = new Kinetic.Stage({
    container: 'container',
    width: 578,
    height: 200
  });
  var layer = new Kinetic.Layer();

  var imageObj = new Image();
  imageObj.onload = function() {
    var blob = new Kinetic.Sprite({
      x: 250,
      y: 40,
      image: imageObj,
      animation: 'idle',
      animations: {
        idle: [
          2,2,70,119,
          71,2,74,119,
          146,2,81,119,
          226,2,76,119
        ],
        punch: [
          2,138,74,122,
          76,138,84,122,
          346,138,120,122
        ]
      },
      frameRate: 7,
      frameIndex: 0,
      //width: imageObj.width / 2,
      //height: imageObj.height / 2
    });

    // add the shape to the layer
    layer.add(blob);

    // Scale image down?
    //layer.scaleX(0.5).scaleY(0.5);

    // add the layer to the stage
    stage.add(layer);

    // start sprite animation
    blob.start();
  };
  imageObj.src = 'http://www.html5canvastutorials.com/demos/assets/blob-sprite.png';
4

0 回答 0