Class: Tween

Members

chainedTween : Phaser.Tween

If this Tween is chained to another this holds a reference to it.

Type:

• Phaser.Tween

Source:

src/tween/Tween.js line 130

<readonly> current : number

The current Tween child being run.

Type:

• number

Source:

src/tween/Tween.js line 120

game : Phaser.Game

A reference to the currently running Game.

Type:

• Phaser.Game

Source:

src/tween/Tween.js line 25

isPaused : boolean

Is this Tween paused or not?

Type:

• boolean

Source:

src/tween/Tween.js line 136

isRunning : boolean

If the tween is running this is set to true, otherwise false. Tweens that are in a delayed state or waiting to start are considered as being running.

Type:

• boolean

Source:

src/tween/Tween.js line 113

manager : Phaser.TweenManager

Reference to the TweenManager responsible for updating this Tween.

Type:

• Phaser.TweenManager

Source:

src/tween/Tween.js line 35

onChildComplete : Phaser.Signal

The onChildComplete event is fired when the Tween or any of its children completes. Fires every time a child completes unless a child is set to repeat forever. It will be sent 2 parameters: the target object and this tween.

Type:

• Phaser.Signal

Source:

src/tween/Tween.js line 100

onComplete : Phaser.Signal

The onComplete event is fired when the Tween and all of its children completes. Does not fire if the Tween is set to loop or repeatAll(-1). It will be sent 2 parameters: the target object and this tween.

Type:

• Phaser.Signal

Source:

src/tween/Tween.js line 107

onLoop : Phaser.Signal

The onLoop event is fired if the Tween, or any child tweens loop. It will be sent 2 parameters: the target object and this tween.

Type:

• Phaser.Signal

Source:

src/tween/Tween.js line 85

onRepeat : Phaser.Signal

The onRepeat event is fired if the Tween and all of its children repeats. If this tween has no children this will never be fired. It will be sent 2 parameters: the target object and this tween.

Type:

• Phaser.Signal

Source:

src/tween/Tween.js line 92

onStart : Phaser.Signal

The onStart event is fired when the Tween begins. If there is a delay before the tween starts then onStart fires after the delay is finished. It will be sent 2 parameters: the target object and this tween.

Type:

• Phaser.Signal

Source:

src/tween/Tween.js line 77

<readonly> pendingDelete : boolean

True if this Tween is ready to be deleted by the TweenManager.

Type:

• boolean

Source:

src/tween/Tween.js line 70

properties : object

Target property cache used when building the child data values.

Type:

• object

Source:

src/tween/Tween.js line 125

repeatCounter : number

If the Tween and any child tweens are set to repeat this contains the current repeat count.

Type:

• number

Source:

src/tween/Tween.js line 63

reverse : boolean

If set to true the current tween will play in reverse. If the tween hasn't yet started this has no effect. If there are child tweens then all child tweens will play in reverse from the current point.

Type:

• boolean

Source:

src/tween/Tween.js line 49

target : object

The target object, such as a Phaser.Sprite or property like Phaser.Sprite.scale.

Type:

• object

Source:

src/tween/Tween.js line 30

timeline : Array

An Array of TweenData objects that comprise the different parts of this Tween.

Type:

• Array

Source:

src/tween/Tween.js line 40

timeScale : number

The speed at which the tweens will run. A value of 1 means it will match the game frame rate. 0.5 will run at half the frame rate. 2 at double the frame rate, etc. If a tweens duration is 1 second but timeScale is 0.5 then it will take 2 seconds to complete.

Type:

• number

Default Value:

• 1

Source:

src/tween/Tween.js line 58

totalDuration : number

Gets the total duration of this Tween, including all child tweens, in milliseconds.

Type:

• number

Source:

src/tween/Tween.js line 899

Methods

<static> updateColor(tween)

A helper for tweening color objects.

It can be passed to onUpdateCallback.

var color = Phaser.Color.createColor(255, 0, 0); // red

var tween = game.add.tween(color).to({
    r: 0, g: 0, b: 255 // blue
});

tween.onUpdateCallback(Phaser.Tween.updateColor);

tween.start();

Parameters:

Name	Type	Description
tween	Phaser.Tween	A Tween with a #target that is a color object.

Source:

src/tween/Tween.js line 172

chain(tweens)

This method allows you to chain tweens together. Any tween chained to this tween will have its Tween.start method called as soon as this tween completes. If this tween never completes (i.e. repeatAll or loop is set) then the chain will never progress. Note that Tween.onComplete will fire when this tween completes, not when the whole chain completes. For that you should listen to onComplete on the final tween in your chain.

If you pass multiple tweens to this method they will be joined into a single long chain. For example if this is Tween A and you pass in B, C and D then B will be chained to A, C will be chained to B and D will be chained to C. Any previously chained tweens that may have been set will be overwritten.

Parameters:

Name	Type	Argument	Description
tweens	Phaser.Tween	<repeatable>	One or more tweens that will be chained to this one.

Source:

src/tween/Tween.js line 573

Returns:

This tween. Useful for method chaining.

Type

Phaser.Tween

delay(duration [, index])

Sets the delay in milliseconds before this tween will start. If there are child tweens it sets the delay before the first child starts. The delay is invoked as soon as you call Tween.start. If the tween is already running this method doesn't do anything for the current active tween. If you have not yet called Tween.to or Tween.from at least once then this method will do nothing, as there are no tweens to delay. If you have child tweens and pass -1 as the index value it sets the delay across all of them.

Parameters:

Name	Type	Argument	Default	Description
duration	number			The amount of time in ms that the Tween should wait until it begins once started is called. Set to zero to remove any active delay.
index	number	<optional>	0	If this tween has more than one child this allows you to target a specific child. If set to -1 it will set the delay on all the children.

Source:

src/tween/Tween.js line 422

Returns:

This tween. Useful for method chaining.

Type

Phaser.Tween

easing(ease [, index])

Set easing function this tween will use, i.e. Phaser.Easing.Linear.None. The ease function allows you define the rate of change. You can pass either a function such as Phaser.Easing.Circular.Out or a string such as "Circ". ".easeIn", ".easeOut" and "easeInOut" variants are all supported for all ease types. If you have child tweens and pass -1 as the index value it sets the easing function defined here across all of them.

Parameters:

Name	Type	Argument	Default	Description
ease	function | string			The easing function this tween will use, i.e. Phaser.Easing.Linear.None.
index	number	<optional>	0	If this tween has more than one child this allows you to target a specific child. If set to -1 it will set the easing function on all children.

Source:

src/tween/Tween.js line 514

Returns:

This tween. Useful for method chaining.

Type

Phaser.Tween

from(properties [, duration] [, ease] [, autoStart] [, delay] [, repeat] [, yoyo])

Sets this tween to be a from tween on the properties given. A from tween sets the target to the destination value and tweens to its current value. For example a Sprite with an x coordinate of 100 tweened from x 500 would be set to x 500 and then tweened to x 100 by giving a properties object of { x: 500 }. The ease function allows you define the rate of change. You can pass either a function such as Phaser.Easing.Circular.Out or a string such as "Circ". ".easeIn", ".easeOut" and "easeInOut" variants are all supported for all ease types.

Parameters:

Name	Type	Argument	Default	Description
properties	object			An object containing the properties you want to tween., such as Sprite.x or Sound.volume. Given as a JavaScript object.
duration	number	<optional>	1000	Duration of this tween in ms.
ease	function | string	<optional>	null	Easing function. If not set it will default to Phaser.Easing.Default, which is Phaser.Easing.Linear.None by default but can be over-ridden.
autoStart	boolean	<optional>	false	Set to true to allow this tween to start automatically. Otherwise call Tween.start().
delay	number	<optional>	0	Delay before this tween will start in milliseconds. Defaults to 0, no delay.
repeat	number	<optional>	0	Should the tween automatically restart once complete? If you want it to run forever set as -1. This only effects this individual tween, not any chained tweens.
yoyo	boolean	<optional>	false	A tween that yoyos will reverse itself and play backwards automatically. A yoyo'd tween doesn't fire the Tween.onComplete event, so listen for Tween.onLoop instead.

Source:

src/tween/Tween.js line 246

Returns:

This Tween object.

Type

Phaser.Tween

generateData( [frameRate] [, data])

This will generate an array populated with the tweened object values from start to end. It works by running the tween simulation at the given frame rate based on the values set-up in Tween.to and Tween.from. It ignores delay and repeat counts and any chained tweens, but does include child tweens. Just one play through of the tween data is returned, including yoyo if set.

Parameters:

Name	Type	Argument	Default	Description
frameRate	number	<optional>	60	The speed in frames per second that the data should be generated at. The higher the value, the larger the array it creates.
data	array	<optional>		If given the generated data will be appended to this array, otherwise a new array will be returned.

Source:

src/tween/Tween.js line 847

Returns:

An array of tweened values.

Type

array

interpolation(interpolation [, context] [, index])

Sets the interpolation function the tween will use. By default it uses Phaser.Math.linearInterpolation. Also available: Phaser.Math.bezierInterpolation and Phaser.Math.catmullRomInterpolation. The interpolation function is only used if the target properties is an array. If you have child tweens and pass -1 as the index value and it will set the interpolation function across all of them.

Parameters:

Name	Type	Argument	Default	Description
interpolation	function			The interpolation function to use (Phaser.Math.linearInterpolation by default)
context	object	<optional>		The context under which the interpolation function will be run.
index	number	<optional>	0	If this tween has more than one child this allows you to target a specific child. If set to -1 it will set the interpolation function on all children.

Source:

src/tween/Tween.js line 535

Returns:

This tween. Useful for method chaining.

Type

Phaser.Tween

loop( [value])

Enables the looping of this tween. The tween will loop forever, and onComplete will never fire.

If value is true then this is the same as setting Tween.repeatAll(-1). If value is false it is the same as setting Tween.repeatAll(0) and will reset the repeatCounter to zero.

Usage: game.add.tween(p).to({ x: 700 }, 1000, Phaser.Easing.Linear.None, true) .to({ y: 300 }, 1000, Phaser.Easing.Linear.None) .to({ x: 0 }, 1000, Phaser.Easing.Linear.None) .to({ y: 0 }, 1000, Phaser.Easing.Linear.None) .loop();

Parameters:

Name	Type	Argument	Default	Description
value	boolean	<optional>	true	If true this tween will loop once it reaches the end. Set to false to remove an active loop.

Source:

src/tween/Tween.js line 606

Returns:

This tween. Useful for method chaining.

Type

Phaser.Tween

onUpdateCallback(callback, callbackContext)

Sets a callback to be fired each time this tween updates.

The callback receives the current Tween, the 'value' of the current TweenData, and the current TweenData. The second parameter is most useful.

tween.onUpdateCallback(function (tween, value, tweenData) {
  console.log('Tween running -- percent: %.2f value: %.2f', tweenData.percent, value);
});

Parameters:

Name	Type	Description
callback	function	The callback to invoke each time this tween is updated. Set to null to remove an already active callback.
callbackContext	object	The context in which to call the onUpdate callback.

Source:

src/tween/Tween.js line 631

Returns:

This tween. Useful for method chaining.

Type

Phaser.Tween

pause()

Pauses the tween. Resume playback with Tween.resume.

Source:

src/tween/Tween.js line 655

repeat(total [, repeat] [, index])

Sets the number of times this tween will repeat. If you have not yet called Tween.to or Tween.from at least once then this method will do nothing, as there are no tweens to repeat. If you have child tweens and pass -1 as the index value it sets the number of times they'll repeat across all of them. If you wish to define how many times this Tween and all children will repeat see Tween.repeatAll.

Parameters:

Name	Type	Argument	Default	Description
total	number			How many times a tween should repeat before completing. Set to zero to remove an active repeat. Set to -1 to repeat forever.
repeat	number	<optional>	0	This is the amount of time to pause (in ms) before the repeat will start.
index	number	<optional>	0	If this tween has more than one child this allows you to target a specific child. If set to -1 it will set the repeat value on all the children.

Source:

src/tween/Tween.js line 438

Returns:

This tween. Useful for method chaining.

Type

Phaser.Tween

repeatAll( [total])

Set how many times this tween and all of its children will repeat. A tween (A) with 3 children (B,C,D) with a repeatAll value of 2 would play as: ABCDABCD before completing.

Parameters:

Name	Type	Argument	Default	Description
total	number	<optional>	0	How many times this tween and all children should repeat before completing. Set to zero to remove an active repeat. Set to -1 to repeat forever.

Source:

src/tween/Tween.js line 556

Returns:

This tween. Useful for method chaining.

Type

Phaser.Tween

repeatDelay(duration [, index])

Sets the delay in milliseconds before this tween will repeat itself. The repeatDelay is invoked as soon as you call Tween.start. If the tween is already running this method doesn't do anything for the current active tween. If you have not yet called Tween.to or Tween.from at least once then this method will do nothing, as there are no tweens to set repeatDelay on. If you have child tweens and pass -1 as the index value it sets the repeatDelay across all of them.

Parameters:

Name	Type	Argument	Default	Description
duration	number			The amount of time in ms that the Tween should wait until it repeats or yoyos once start is called. Set to zero to remove any active repeatDelay.
index	number	<optional>	0	If this tween has more than one child this allows you to target a specific child. If set to -1 it will set the repeatDelay on all the children.

Source:

src/tween/Tween.js line 460

Returns:

This tween. Useful for method chaining.

Type

Phaser.Tween

resume()

Resumes a paused tween.

Source:

src/tween/Tween.js line 685

start( [index])

Starts the tween running. Can also be called by the autoStart parameter of to or from. This sets the isRunning property to true and dispatches the onStart signal. If the tween has a delay set then nothing will start tweening until the delay has expired. If the tween is already running, is flagged for deletion (such as after stop), or has an empty timeline, calling start has no effect and the onStart signal is not dispatched.

Parameters:

Name	Type	Argument	Default	Description
index	number	<optional>	0	If this Tween contains child tweens you can specify which one to start from. The default is zero, i.e. the first tween created.

Source:

src/tween/Tween.js line 292

Returns:

This tween. Useful for method chaining.

Type

Phaser.Tween

stop( [complete])

Stops the tween if running and flags it for deletion from the TweenManager. The tween can't be restarted after this. The onComplete signal is not dispatched and no chained tweens are started unless the complete parameter is set to true. If you just wish to pause a tween then use pause instead. If the tween is not running, it is not flagged for deletion and can be started again.

Parameters:

Name	Type	Argument	Default	Description
complete	boolean	<optional>	false	Set to true to dispatch the Tween.onComplete signal.

Source:

src/tween/Tween.js line 355

Returns:

This tween. Useful for method chaining.

Type

Phaser.Tween

to(properties [, duration] [, ease] [, autoStart] [, delay] [, repeat] [, yoyo])

Sets this tween to be a to tween on the properties given. A to tween starts at the current value and tweens to the destination value given. For example a Sprite with an x coordinate of 100 could be tweened to x 200 by giving a properties object of { x: 200 }. The ease function allows you define the rate of change. You can pass either a function such as Phaser.Easing.Circular.Out or a string such as "Circ". ".easeIn", ".easeOut" and "easeInOut" variants are all supported for all ease types.

Parameters:

Name	Type	Argument	Default	Description
properties	object			An object containing the properties you want to tween, such as Sprite.x or Sound.volume. Given as a JavaScript object.
duration	number	<optional>	1000	Duration of this tween in ms.
ease	function | string	<optional>	null	Easing function. If not set it will default to Phaser.Easing.Default, which is Phaser.Easing.Linear.None by default but can be over-ridden.
autoStart	boolean	<optional>	false	Set to true to allow this tween to start automatically. Otherwise call Tween.start().
delay	number	<optional>	0	Delay before this tween will start in milliseconds. Defaults to 0, no delay.
repeat	number	<optional>	0	Should the tween automatically restart once complete? If you want it to run forever set as -1. This only effects this individual tween, not any chained tweens.
yoyo	boolean	<optional>	false	A tween that yoyos will reverse itself and play backwards automatically. A yoyo'd tween doesn't fire the Tween.onComplete event, so listen for Tween.onLoop instead.

Source:

src/tween/Tween.js line 200

Returns:

This Tween object.

Type

Phaser.Tween

update(time)

Core tween update function called by the TweenManager. Does not need to be invoked directly.

Parameters:

Name	Type	Description
time	number	A timestamp passed in by the TweenManager.

Source:

src/tween/Tween.js line 725

Returns:

false if the tween and all child tweens have completed and should be deleted from the manager, otherwise true (still active).

Type

boolean

updateTweenData(property, value [, index])

Updates either a single TweenData or all TweenData objects properties to the given value. Used internally by methods like Tween.delay, Tween.yoyo, etc. but can also be called directly if you know which property you want to tweak. The property is not checked, so if you pass an invalid one you'll generate a run-time error.

Parameters:

Name	Type	Argument	Default	Description
property	string			The property to update.
value	number | function			The value to set the property to.
index	number	<optional>	0	If this tween has more than one child this allows you to target a specific child. If set to -1 it will set the delay on all the children.

Source:

src/tween/Tween.js line 390

Returns:

This tween. Useful for method chaining.

Type

Phaser.Tween

yoyo(enable [, yoyoDelay] [, index])

A Tween that has yoyo set to true will run through from its starting values to its end values and then play back in reverse from end to start. Used in combination with repeat you can create endless loops. If you have not yet called Tween.to or Tween.from at least once then this method will do nothing, as there are no tweens to yoyo. If you have child tweens and pass -1 as the index value it sets the yoyo property across all of them. If you wish to yoyo this Tween and all of its children then see Tween.yoyoAll.

Parameters:

Name	Type	Argument	Default	Description
enable	boolean			Set to true to yoyo this tween, or false to disable an already active yoyo.
yoyoDelay	number	<optional>	0	This is the amount of time to pause (in ms) before the yoyo will start.
index	number	<optional>	0	If this tween has more than one child this allows you to target a specific child. If set to -1 it will set yoyo on all the children.

Source:

src/tween/Tween.js line 476

Returns:

This tween. Useful for method chaining.

Type

Phaser.Tween

yoyoDelay(duration [, index])

Sets the delay in milliseconds before this tween will run a yoyo (only applies if yoyo is enabled). The repeatDelay is invoked as soon as you call Tween.start. If the tween is already running this method doesn't do anything for the current active tween. If you have not yet called Tween.to or Tween.from at least once then this method will do nothing, as there are no tweens to set repeatDelay on. If you have child tweens and pass -1 as the index value it sets the repeatDelay across all of them.

Parameters:

Name	Type	Argument	Default	Description
duration	number			The amount of time in ms that the Tween should wait until it repeats or yoyos once start is called. Set to zero to remove any active yoyoDelay.
index	number	<optional>	0	If this tween has more than one child this allows you to target a specific child. If set to -1 it will set the yoyoDelay on all the children.

Source:

src/tween/Tween.js line 498

Returns:

This tween. Useful for method chaining.

Type

Phaser.Tween