首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >在Craftyjs中更改sprite框架

在Craftyjs中更改sprite框架
EN

Stack Overflow用户
提问于 2015-12-05 17:38:09
回答 1查看 217关注 0票数 0

如何手动将sprite从框架0设置为框架1?

代码语言:javascript
复制
//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});
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2015-12-09 20:33:33

您可以通过Sprite.sprite()更改从spritesheet中使用的sprite。

因此,在您的例子中,将第一个sprite更改为第二个框架中的第二个sprite:

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

下面是演示一个不断变化的精灵的片段。请注意,使用了Crafty.sprite的替代表示法,它可以让您自由地思考平铺坐标,而不是像素坐标。

代码语言:javascript
复制
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
      });
代码语言:javascript
复制
<html>

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

<body>
</body>

</html>

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/34108649

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档