javascript - Phaser 3 中特定动画完成时的回调？

Question

我正在使用 Phaser 3 框架创建一个游戏，它有很多动画。在我的代码中，我已经有一个在播放任何动画后播放(或恢复)的动画，这很好。它的代码是

 //This keeps the rolling animation going once the push animation is done
    skater.on('animationcomplete', () => {
        skater.anims.play('roll');
    });

但对于游戏的其余部分，我需要在相应动画完成后执行特定操作。有没有和上面类似的函数，我可以把动画的键或名称作为参数传递？

我目前是在 Phaser 3 讨论板上看到的这个例子。这一切都在 create() 函数中。

    //Animation key
    const shuvKey = 'shuv'
    //Shuvit animation
    var shuvFrameNames = this.anims.generateFrameNames(
        'sheet', {start: 9, end: 12, zeroPad: 4,
        prefix: 'shuv/'}
    );
    this.anims.create({
        key: shuvKey, frames: shuvFrameNames, frameRate: 32, repeat: 0 
    });
    skater.once(game.Animations.Events.SPRITE_ANIMATION_KEY_COMPLETE + shuvKey, function(animation, frame) {
        score += 3;         
        }, this);

但我收到“未捕获的类型错误:无法读取未定义的属性‘事件’”。我不确定这是否与我的游戏配置有关，所以我将在下面发布。

配置

//Configurations for the physics engine
var physicsConfig = {
    default: 'matter',
    matter : {
        gravity: {
            x: 0,
            y: 2.5, // <--This is the only way I could get the skater to roll up the ramp.
        },
        debug: true //CHANGE THIS TO TRUE TO SEE LINES
    }   
}

//Variables for height and width
var gameHeight = 750;
var gameWidth = 3000;

//Game configurations
var config = {
    type: Phaser.AUTO,
    width: 1500, //<-- this is the width of what we will see at one time
    height: gameHeight,
    physics: physicsConfig,
    scene: {
        preload: preload,
        create: create,
        update: update
    }   
}

/* This variable will be used to make sure the skater 
cannot ollie while he is already in the air */
let skaterTouchingGround;

//Start the game
var game = new Phaser.Game(config);

我需要能够传递一个函数，该函数会在给定动画完成时执行任何后续操作，而不是仅在任何动画完成时执行。

Answer 1

您可以使用 animationcomplete 事件在动画完成后运行回调函数:

skater.on('animationcomplete', doSomething);

doSomething = () => {
   alert('Animation finished!');
}

编辑:

OP 询问如何调用不同的函数作为回调，一种方法是这样的:

skater.on('animationcomplete', doSomething);

skater.on('animationcomplete', doSomethingAgain);

doSomething = () => {
   alert('Animation finished!');
}

doSomethingAgain = () => {
   alert('Animation finished again!')
}