Phaser.Animation - 2.6.2

new Animation(game, parent, name, frameData, frames, frameRate, loop)

An Animation instance contains a single animation and the controls to play it.

It is created by the AnimationManager, consists of Animation.Frame objects and belongs to a single Game Object such as a Sprite.

Parameters

Name	Type	Argument	Default	Description
`game`	Phaser.Game			A reference to the currently running game.
`parent`	Phaser.Sprite			A reference to the owner of this Animation.
`name`	string			The unique name for this animation, used in playback commands.
`frameData`	Phaser.FrameData			The FrameData object that contains all frames used by this Animation.
`frames`	Array.<number> \| Array.<string>			An array of numbers or strings indicating which frames to play in which order.
`frameRate`	number	<optional>	60	The speed at which the animation should play. The speed is given in frames per second.
`loop`	boolean	<optional>	false	Whether or not the animation is looped or just plays once.

Source code: animation/Animation.js (Line 22)

Public Properties

currentFrame : Phaser.Frame

The currently displayed frame of the Animation.

Source code: animation/Animation.js (Line 125)

delay : number

The delay in ms between each frame of the Animation, based on the given frameRate.

Source code: animation/Animation.js (Line 58)

enableUpdate : boolean

Gets or sets if this animation will dispatch the onUpdate events upon changing frame.

Source code: animation/Animation.js (Line 800)

frame : number

Gets or sets the current frame index and updates the Texture Cache for display.

Source code: animation/Animation.js (Line 739)

[readonly] frameTotal : number

The total number of frames in the currently loaded FrameData, or -1 if no FrameData is loaded.

Source code: animation/Animation.js (Line 726)

game : Phaser.Game

A reference to the currently running Game.

Source code: animation/Animation.js (Line 29)

isFinished : boolean

The finished state of the Animation. Set to true once playback completes, false during playback.

Source code: animation/Animation.js (Line 80)

isPaused : boolean

The paused state of the Animation.

Source code: animation/Animation.js (Line 92)

isPlaying : boolean

The playing state of the Animation. Set to false once playback completes, true during playback.

Source code: animation/Animation.js (Line 86)

isReversed : boolean

Indicates if the animation will play backwards.

Source code: animation/Animation.js (Line 157)

killOnComplete : boolean

Should the parent of this Animation be killed when the animation completes?

Source code: animation/Animation.js (Line 74)

loop : boolean

The loop state of the Animation.

Source code: animation/Animation.js (Line 63)

loopCount : number

The number of times the animation has looped since it was last started.

Source code: animation/Animation.js (Line 68)

name : string

The user defined name given to this Animation.

Source code: animation/Animation.js (Line 46)

onComplete : Phaser.Signal

This event is dispatched when this Animation completes playback. If the animation is set to loop this is never fired, listen for onLoop instead.

Source code: animation/Animation.js (Line 146)

onLoop : Phaser.Signal

This event is dispatched when this Animation loops.

Source code: animation/Animation.js (Line 151)

onStart : Phaser.Signal

This event is dispatched when this Animation starts playback.

Source code: animation/Animation.js (Line 130)

onUpdate : Phaser.Signal | null

This event is dispatched when the Animation changes frame.
By default this event is disabled due to its intensive nature. Enable it with: Animation.enableUpdate = true.
Note that the event is only dispatched with the current frame. In a low-FPS environment Animations
will automatically frame-skip to try and claw back time, so do not base your code on expecting to
receive a perfectly sequential set of frames from this event.

Type

Phaser.Signal | null

Source code: animation/Animation.js (Line 141)

paused : boolean

Gets and sets the paused state of this Animation.

Source code: animation/Animation.js (Line 672)

reversed : boolean

Gets and sets the isReversed state of this Animation.

Source code: animation/Animation.js (Line 706)

speed : number

Gets or sets the current speed of the animation in frames per second. Changing this in a playing animation will take effect from the next frame. Value must be greater than 0.

Source code: animation/Animation.js (Line 777)

Public Methods

<static> generateFrameNames(prefix, start, stop, suffix, zeroPad) → {Array.<string>}

Really handy function for when you are creating arrays of animation data but it's using frame names and not numbers.
For example imagine you've got 30 frames named: 'explosion_0001-large' to 'explosion0030-large'
You could use this function to generate those by doing: Phaser.Animation.generateFrameNames('explosion', 1, 30, '-large', 4);

Parameters

Name	Type	Argument	Default	Description
`prefix`	string			The start of the filename. If the filename was 'explosion0001-large' the prefix would be 'explosion'.
`start`	number			The number to start sequentially counting from. If your frames are named 'explosion_0001' to 'explosion_0034' the start is 1.
`stop`	number			The number to count to. If your frames are named 'explosion_0001' to 'explosion_0034' the stop value is 34.
`suffix`	string	<optional>	''	The end of the filename. If the filename was 'explosion_0001-large' the prefix would be '-large'.
`zeroPad`	number	<optional>	0	The number of zeros to pad the min and max values with. If your frames are named 'explosion_0001' to 'explosion_0034' then the zeroPad is 4.

Returns

Array.<string> -

An array of framenames.

Source code: animation/Animation.js (Line 828)

complete()

Called internally when the animation finishes playback.
Sets the isPlaying and isFinished states and dispatches the onAnimationComplete event if it exists on the parent and local onComplete event.

Source code: animation/Animation.js (Line 642)

destroy()

Cleans up this animation ready for deletion. Nulls all values and references.

Source code: animation/Animation.js (Line 608)

next(quantity)

Advances by the given number of frames in the Animation, taking the loop value into consideration.

Parameters

Name	Type	Argument	Default	Description
`quantity`	number	<optional>	1	The number of frames to advance.

Source code: animation/Animation.js (Line 531)

onPause()

Called when the Game enters a paused state.

Source code: animation/Animation.js (Line 365)

onResume()

Called when the Game resumes from a paused state.

Source code: animation/Animation.js (Line 379)

play(frameRate, loop, killOnComplete) → {Phaser.Animation}

Plays this animation.

Parameters

Name	Type	Argument	Default	Description
`frameRate`	number	<optional>	null	The framerate to play the animation at. The speed is given in frames per second. If not provided the previously set frameRate of the Animation is used.
`loop`	boolean	<optional>	false	Should the animation be looped after playback. If not provided the previously set loop value of the Animation is used.
`killOnComplete`	boolean	<optional>	false	If set to true when the animation completes (only happens if loop=false) the parent Sprite will be killed.

Returns

Phaser.Animation -

A reference to this Animation instance.

Source code: animation/Animation.js (Line 167)

previous(quantity)

Moves backwards the given number of frames in the Animation, taking the loop value into consideration.

Parameters

Name	Type	Argument	Default	Description
`quantity`	number	<optional>	1	The number of frames to move back.

Source code: animation/Animation.js (Line 563)

restart()

Sets this animation back to the first frame and restarts the animation.

Source code: animation/Animation.js (Line 218)

reverse() → {Phaser.Animation}

Reverses the animation direction.

Returns

Phaser.Animation -

The animation instance.

Source code: animation/Animation.js (Line 246)

reverseOnce() → {Phaser.Animation}

Reverses the animation direction for the current/next animation only
Once the onComplete event is called this method will be called again and revert
the reversed state.

Returns

Phaser.Animation -

The animation instance.

Source code: animation/Animation.js (Line 260)

setFrame(frameId, useLocalFrameIndex)

Sets this animations playback to a given frame with the given ID.

Parameters

Name	Type	Argument	Default	Description
`frameId`	string \| number	<optional>		The identifier of the frame to set. Can be the name of the frame, the sprite index of the frame, or the animation-local frame index.
`useLocalFrameIndex`	boolean	<optional>	false	If you provide a number for frameId, should it use the numeric indexes of the frameData, or the 0-indexed frame index local to the animation.

Source code: animation/Animation.js (Line 276)

stop(resetFrame, dispatchComplete)

Stops playback of this animation and set it to a finished state. If a resetFrame is provided it will stop playback and set frame to the first in the animation.
If dispatchComplete is true it will dispatch the complete events, otherwise they'll be ignored.

Parameters

Name	Type	Argument	Default	Description
`resetFrame`	boolean	<optional>	false	If true after the animation stops the currentFrame value will be set to the first frame in this animation.
`dispatchComplete`	boolean	<optional>	false	Dispatch the Animation.onComplete and parent.onAnimationComplete events?

Source code: animation/Animation.js (Line 334)

update()

Updates this animation. Called automatically by the AnimationManager.

Source code: animation/Animation.js (Line 393)

updateFrameData(frameData)

Changes the FrameData object this Animation is using.

Parameters

Name	Type	Description
`frameData`	Phaser.FrameData	The FrameData object that contains all frames used by this Animation.

Source code: animation/Animation.js (Line 595)

Navigation

Constructor

new Animation(game, parent, name, frameData, frames, frameRate, loop)

Parameters

Public Properties

currentFrame : Phaser.Frame

delay : number

enableUpdate : boolean

frame : number

[readonly] frameTotal : number

game : Phaser.Game

isFinished : boolean

isPaused : boolean

isPlaying : boolean

isReversed : boolean

killOnComplete : boolean

loop : boolean

loopCount : number

name : string

onComplete : Phaser.Signal

onLoop : Phaser.Signal

onStart : Phaser.Signal

onUpdate : Phaser.Signal | null

Type

paused : boolean

reversed : boolean

speed : number

Public Methods

<static> generateFrameNames(prefix, start, stop, suffix, zeroPad) → {Array.<string>}

Parameters

Returns

complete()

destroy()

next(quantity)

Parameters

onPause()

onResume()

play(frameRate, loop, killOnComplete) → {Phaser.Animation}

Parameters

Returns

previous(quantity)

Parameters

restart()

reverse() → {Phaser.Animation}

Returns

reverseOnce() → {Phaser.Animation}

Returns

setFrame(frameId, useLocalFrameIndex)

Parameters

stop(resetFrame, dispatchComplete)

Parameters

update()

updateFrameData(frameData)

Parameters