3

我要做的基本上是在我的box2d项目中制作这个动画http://jsfiddle.net/TLYZS/6/，但是我在每一帧的绘制逻辑上遇到了一些麻烦，这是迄今为止的结果：http：/ /jsfiddle.net/H8e9m/6/ 如何修复身体绘制功能以使动画工作？如您所见，我只能绘制动画精灵的第一帧，我找不到在第一个 jsfiddle 中显示完全相同的动画的方法，您可以在其中看到角色处于空闲模式。感谢任何帮助

这是绘图功能，问题可能在这里

 if (this.details.frame != null) {
            console.log("NotNull");
            context.drawImage(this.details.image, this.details.frame.x, this.details.frame.y, this.details.frame.width, this.details.frame.height, 
                             -this.details.width / 2, -this.details.height / 2,
                              this.details.width, this.details.height);

这是动画变量和更新函数

        var KenIdle = new Animation(10, [
        { x: 50 * 0, y: 0 * 100, width: 50, height: 100 },
        { x: 50 * 1, y: 0 * 100, width: 50, height: 100 },
        { x: 50 * 2, y: 0 * 100, width: 50, height: 100 },
        { x: 50 * 3, y: 0 * 100, width: 50, height: 100 },
        ]);

        function update(dt) {
            KenBody.details.frame = KenIdle.draw(dt);
        }

请检查我的 jsfiddle 以查看到目前为止的进度并告诉我如何解决此问题

4

1 回答 1

2

我终于找到了我的问题：

  var KenIdle = new Animation(10000, [
                    { x: 50 * 0, y: 0 * 100, width: 50, height: 100 },
                    { x: 50 * 1, y: 0 * 100, width: 50, height: 100 },
                    { x: 50 * 2, y: 0 * 100, width: 50, height: 100 },
                    { x: 50 * 3, y: 0 * 100, width: 50, height: 100 },
                    ]);

经过的时间或dt太小，我看不到动画在移动，所以我把它放大了，它现在可以工作了http://jsfiddle.net/H8e9m/7/

于 2014-04-09T07:13:56.600 回答