Listen for Spine Animation end

Phaser 3
1

Is there any way to listen for the end of a specific spine animation?

I’m able to fire an event when any animation ends using spine.on("complete", ... but I can’t find a way to filter it or apply it to a single animation.

There’s some stuff in the Spine API about AnimationStateListeners, but I don’t understand it :frowning:

1 Like
2

Hello! I know it’s a bit late but I want to answer so I can help people that will have the same question.

As of 2024, I prefer to use @esotericsoftware/spine-phaser other than the built-in phaser plugin.

Here’s how to do it:

if (this.spine?.animationState) {
    // Clear previous listeners to avoid duplicates if setting a new animation
    this.spine.animationState.clearListeners();

    // Set the animation (the third argument specifies whether it loops)
    this.spine.animationState.setAnimation(0, attackAnimation, false); // Set to false to play once if you want to listen for the end

    // Listen for the "complete" event, which is fired when an animation finishes
    this.spine.animationState.addListener({
        complete: (trackEntry) => {
            // Animation has completed
            console.log(`Animation ${trackEntry.animation.name} has completed`);

            // Perform any actions you need after the animation ends here
            // For example, switching back to an idle animation or triggering game logic
        }
    });
}
1 Like