0

スプライトをフレーム 0 からフレーム 1 に手動で設定するにはどうすればよいですか?

//Load assets
Crafty.sprite("assets/img/q.png", {
qd1 : [ 0, 0, 17, 16 ],
qd2 : [ 0, 17, 17, 16 ]
});

var a=Crafty.e("2D, Canvas, SpriteAnimation, qd1").attr({x : 355, y : 225});
4

1 に答える 1

0

を介してスプライトシートから使用するスプライトを変更しSprite.sprite()ます。
したがって、あなたの場合、2 番目のフレームで 1 番目のスプライトを 2 番目のスプライトに変更するには:

Crafty.e("2D, Canvas, qd1")
      .attr({x : 355, y : 225})
      .one("EnterFrame", function() {
          this.sprite(0, 17, 17, 16);
      });

以下は、絶えず変化するスプライトを示すスニペットです。の代替表記法Crafty.spriteが使用されていることに注意してください。これにより、ピクセル座標ではなく、タイル座標の観点から考えることができます。

Crafty.init();
Crafty.background('white');

// define spritesheet, each tile spans 60x60 px, 9 sprites in one row
Crafty.sprite(60, "https://cdnjs.cloudflare.com/ajax/libs/leaflet.draw/0.2.3/images/spritesheet-2x.png", {
  first_sprite : [ 0, 0 ]
});

Crafty.e("2D, Canvas, first_sprite")
      .attr({x : 0, y : 0, idx : 0})
      .bind("EnterFrame", function(frameData) {
          if (frameData.frame % 100 === 0) // trigger roughly every 2 seconds
            this.sprite(++this.idx % 9, 0); // cycle through the 9 available sprites
      });
<html>

<head>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/crafty/0.6.3/crafty-min.js"></script>
</head>

<body>
</body>

</html>

于 2015-12-09T20:33:33.657 に答える