如何仅在精灵在 Phaser 3 中移动时播放动画？

Question

我正在 Phaser 3 中创建一个游戏，使用物质物理学，就像我以前做过的那样。然而，直到现在我从未运行解决过一个问题，涉及动画和移动。我希望我的动画只在玩家移动时播放，并在他停止移动时停止，就像玩家在真实游戏中一样。

我尝试了各种 do-while 循环，使用 "animationcomplete" 和不使用它。我也试过让我的动画循环 (repeat: -1) 并将它设置为只执行一次。

我知道，.isDown 跟踪键并在按下时执行以下代码，而 .JustDown 只执行一次。我也不确定在那里使用哪个。

动画代码

 //Animations
        //Running right animation
        var runRightFrameNames = this.anims.generateFrameNames(
            'sheet', {start: 14, end: 16, zeroPad: 4,
            prefix : 'run_right/'}
        );
        this.anims.create({
            key: 'runRight', frames: runRightFrameNames, frameRate: 1, repeat: 0
        });

update() 函数中的当前代码，不是我尝试过的唯一代码

        //If the right arrowkey is pressed
        if (this.arrowKeys.right.isDown) {
            //Move player
            this.hero.setVelocityX(5);
            //Play animation
            this.hero.anims.play('runRight');
            //When animation is done, stop hero
            this.hero.on("animationcomplete", () => {
                this.hero.setVelocityX(0);
            });
        }

Answer 1

您可以像这样修改您的代码片段：

//If the right arrowkey is pressed
if (this.arrowKeys.right._justDown) {
    console.log('Cursor right is pressed!');

    //Move player
    this.hero.setVelocityX(5);

    //Play animation
    this.hero.anims.play('runRight');

} else if (this.arrowKeys.right._justUp) {
    console.log('Cursor right is NOT pressed!');
}

编辑：

要修复英雄的动画，请将此行 this.hero.anims.play('runRight'); 更改为 this.hero.anims.play('runRight', true);

您还应该将 repeat 值更改为 -1，如下所示：

this.anims.create({
    key: 'runRight', frames: runRightFrameNames, frameRate: 6, repeat: -1
});

如何仅在精灵在 Phaser 3 中移动时播放动画？

How to only play animation while a sprite is moving in Phaser 3?

animation

game-physics

phaser-framework

matter.js