Skip to main content

AnimationsController

Manages animation playback, state/event grouping, track allocation, and Spine event listeners. Accessed via layout.animations.

Methods​

registerSpine​

registerSpine(spineID: string, spine: Spine)

Registers a spine instance, wiring up its animation metadata and event listeners. Called internally during spine creation.


getAall​

getAall(): string[]

Returns all registered animation names (without modifiers).


getBySpine​

getBySpine(): Map<string, string[]>

Returns a map of spineID → the animation names (without modifiers) that spine holds, for each spine that has any. An animation authored in several spine files appears under each of them.


getStates​

getStates(): string[]

Returns all registered state names (from state_<name>/ folders).


getEvents​

getEvents(): string[]

Returns all registered event names (from event_<name>/ folders).


getActive​

getActive(): string[]

Returns the names of all currently playing (non-looping) animations.


getLooping​

getLooping(): string[]

Returns the names of all currently looping animations.


activeStates​

activeStates(options?: { builtIn?: boolean }): string[]

The states the scene stands in: every registered state playState played and nothing has stopped since, oldest first, a replayed one moved to the end. stopState and stopAll take a state off the list; a state whose one-shots merely finished stays on it. The states the layout plays for itself — init, landscape, portrait — are left out unless builtIn is set.


addEventListener​

addEventListener(event: string, fn: (event: unknown) => void)

Subscribes a callback to a named Spine skeleton event. Multiple listeners per event are supported.


playState​

playState(stateName: string): Promise<void>

Plays all animations grouped under the given state name (e.g. "idle" triggers every animation in state_idle/).

Playing a state the spine already sits in changes nothing: an animation still running on its track — a loop, or a one-shot that has not finished — is left where it is rather than restarted from frame 0. Pass { restart: true } to start them over.


playEvent​

playEvent(eventName: string, spineID: string, payload?: Record<string, unknown>): Promise<void>

Plays all animations grouped under the given event name and notifies registered listeners. payload is merged into the object handed to the listeners alongside eventName, so synthetic events can carry context (e.g. a text change's from/to values).


playAnimationByName​

playAnimationByName(animationName: string, playSolo?: boolean, trackID?: number): Promise<void>

Plays the named animation on every spine that has it. Pass playSolo=true to stop all other animations first.


playSolo​

playSolo(animationName: string): Promise<void>

Stops all running animations, then plays the named animation on all spines that have it.


playInstanceAnimation​

playInstanceAnimation(spineID: string, animation: string, playSolo?: boolean, trackID?: number): Promise<void>

Plays a specific animation on a single spine by ID. Resolves when the animation completes (looping animations resolve immediately).


playInstanceAnimationLastFrame​

playInstanceAnimationLastFrame(spineID: string, animation: string, playSolo?: boolean): Promise<void>

Plays an animation then immediately seeks to its last frame, effectively showing the end pose.


stopAll​

stopAll();

Stops all animations on all spines and resets them to their setup pose.


stopAllBySpineID​

stopAllBySpineID(spineID: string)

Stops all animations on a specific spine and resets it to the setup pose.


stopAnimation​

stopAnimation(spineID: string, animation: string)

Stops a specific animation on a specific spine, clearing its track.


pauseState​

pauseState(stateName: string)

Pauses all spines involved in the given state by setting their timeScale to 0.


pauseSpineByID​

pauseSpineByID(spineID: string)

Pauses a specific spine by setting its timeScale to 0.


speed (setter)​

set speed(value: number)

Sets the global playback speed for all spines (timeScale).


Behaviour Notes​

  • Sound channel per event — a skeleton event whose name starts with music plays on the music channel (playMusic); everything else is FX (playFX), looping when the name ends with _loop. So spin_loop is a looping effect, not a music track.
  • Sound cleanup on stop — FX started by a skeleton event are attributed to the animation whose timeline fired them, and every stop path (stopAnimation, stopState, stopAll, stopAllBySpineID, reset, unregisterSpine, clear) stops those FX, so a looping or long FX cannot outlive its animation. An FX is left playing when another still-running animation triggered the same sound — Sounds keeps one instance per sound name, so stopping it would cut that animation's audio too (five reels sharing one spin loop stop it only when the last reel does). Music is never stopped this way: a track plays until another one replaces it. Animations that finish on their own are not affected — only explicit stops are.