Skip to content
Tween<T>

Utils / Tween

Tween<T> Class

Animation (from in between) is a concept that allows you to change property of objects in a smooth way. You just need to tell it which property to change, what final values they should have when the session ends, and how long this will take, The interpolation engine will be responsible for calculating the values from the starting point to the ending point.

Type parameters

Textends TweenUnknownProps

Table of contents

Methods

chain(...tweens: Tween<any>[]): Tween<T> other
Link (multiple) interstitial objects to the current interstitial object. Start the link's interval immediately upon completion of the current interval
delay(amount?: number): Tween<T> other
Delayed start
duration(d?: number): Tween<T> other
Set the time (period) required to complete the gap filling
easing([easing](mw.Tween.md#easing)Function?): Tween<T> other
Set the buffering function
end(): Tween<T> other
Set the current interpolation to target status
getID(): number other
Get the ID of the current interstitial object
group([group](mw.Tween.md#group)?): Tween<T> other
Set the grouping of the current gap object
interpolation([interpolation](mw.Tween.md#interpolation)Function?): Tween<T> other
Set interpolation function
isPaused(): boolean other
Retrieve whether the current interval object is in a paused state.
isPlaying(): boolean other
Get whether the current interpolation object is in the interpolation process. In the case of not ending the room filling, true will be returned even if the room is pause.
onComplete(callback?: (object: T) => void): Tween<T> other
Triggered when the interval is completed normally (i.e. without stopping), the interval object is passed as the first parameter
onRepeat(callback?: (object: T) => void): Tween<T> other
Triggered every time a gap is completed and the next repetition is about to begin, the gap object is passed as the first parameter
onStart(callback?: (object: T) => void): Tween<T> other
Triggered before the start of interpolation, the interpolation object is passed as the first parameter
onStop(callback?: (object: T) => void): Tween<T> other
Triggered when stopping padding explicitly through stop(), the padding object is passed as the first parameter
onUpdate(callback?: (object: T, elapsed: number) => void): Tween<T> other
Triggered every time there is a gap update, the gap object is passed as the first parameter
pause(time?: number): Tween<T> other
Pause for time compensation. You can specify the effective time of pause. The default is the current time
repeat(times?: number): Tween<T> other
Set the number of repetitions, and the total number of intervals will be the repetition parameter plus an initial interval
repeatDelay(amount?: number): Tween<T> other
Set the delay start time for repeated interval filling
resume(time?: number): Tween<T> other
The effective time of redo can be specified. The default is the current time
start(time?: number): Tween<T> other
Start time compensation. You can specify the start effective time. The default is the current time
stop(): Tween<T> other
Stopping a gap, stopping a gap that has never started or has already stopped, has no effect. No errors were thrown
stopChainedTweens(): Tween<T> other
Stop all gap objects linked to the current gap
to(properties: TweenUnknownProps, duration?: number): Tween<T> other
Set the target status of the supplementary room and the time required to complete the supplementary room
update(time?: number, autoStart?: boolean): boolean other
Update the current supplementary room. Generally speaking, it will be automatically call by the affiliated compensation group, without manually call.
yoyo([yoyo](mw.Tween.md#yoyo)?): Tween<T> other
Set reciprocating (yo yo effect)

Complement constructor

Type parameters

Textends TweenUnknownProps

Parameters

obj TThe object type to create the space
group? false TweenGroupGrouping of the supplementary objects to be create default: mainGroup

Methods

chain

chain(...tweens): Tween<T> other

Link (multiple) interstitial objects to the current interstitial object. Start the link's interval immediately upon completion of the current interval

Parameters

...tweens Tween<any>[]The padding object (array) to be linked

Returns

Tween<T>The current interval object can be called in a chain like manner

Usage example: example

ts
// Start B after A ends
tweenA.chain(tweenB)

// A-B cycle
tweenA.chain(tweenB)
tweenB.chain(tweenA)

// Start B and C simultaneously after A ends
tweenA.chain(tweenB, tweenC)
// Start B after A ends
tweenA.chain(tweenB)

// A-B cycle
tweenA.chain(tweenB)
tweenB.chain(tweenA)

// Start B and C simultaneously after A ends
tweenA.chain(tweenB, tweenC)

delay

delay(amount?): Tween<T> other

Delayed start

Parameters

amount? numberDelay time, unit: ms. Default: 0
range: [0,+∞] type: floating-point number

Returns

Tween<T>The current interval object can be called in a chain like manner

duration

duration(d?): Tween<T> other

Set the time (period) required to complete the gap filling

Parameters

d? numberThe time required to complete the gap, in milliseconds. Default: 1000
range: [0,+∞] type: floating-point number

Returns

Tween<T>The current interval object can be called in a chain like manner

easing

easing(easingFunction?): Tween<T> other

Set the buffering function

Parameters

easingFunction? TweenEasingFunctionSlow function default: Easy Linear.None

Returns

Tween<T>The current interval object can be called in a chain like manner

end

end(): Tween<T> other

Set the current interpolation to target status

Returns

Tween<T>The current interval object can be called in a chain like manner

getID

getID(): number other

Get the ID of the current interstitial object

Returns

numberThe ID of the current supplementary object

group

group(group?): Tween<T> other

Set the grouping of the current gap object

Parameters

group? TweenGroupNew grouping default: mainGroup

Returns

Tween<T>The current interval object can be called in a chain like manner

interpolation

interpolation(interpolationFunction?): Tween<T> other

Set interpolation function

Parameters

interpolationFunction? TweenInterpolationFunctionInterpolation function default: Interpolation Linear

Returns

Tween<T>The current interval object can be called in a chain like manner

isPaused

isPaused(): boolean other

Retrieve whether the current interval object is in a paused state.

Returns

booleanTrue pause; Fall - in the gap.

isPlaying

isPlaying(): boolean other

Get whether the current interpolation object is in the interpolation process. In the case of not ending the room filling, true will be returned even if the room is pause.

Returns

booleanTrue - in the process of filling gaps; False - Not in the process of filling, not started or already ended.

onComplete

onComplete(callback?): Tween<T> other

Triggered when the interval is completed normally (i.e. without stopping), the interval object is passed as the first parameter

Parameters

callback? (object: T) => voidThe callback function to bind default: undefined

Returns

Tween<T>The current interval object can be called in a chain like manner

onRepeat

onRepeat(callback?): Tween<T> other

Triggered every time a gap is completed and the next repetition is about to begin, the gap object is passed as the first parameter

Parameters

callback? (object: T) => voidThe callback function to bind default: undefined

Returns

Tween<T>The current interval object can be called in a chain like manner

onStart

onStart(callback?): Tween<T> other

Triggered before the start of interpolation, the interpolation object is passed as the first parameter

Parameters

callback? (object: T) => voidThe callback function to bind default: undefined

Returns

Tween<T>The current interval object can be called in a chain like manner

Precautions

  1. Execute before the start of the interval, i.e. before the calculation.
  2. Each interval can only be executed once. When repeating the interval through repetiti(), it will not run.

onStop

onStop(callback?): Tween<T> other

Triggered when stopping padding explicitly through stop(), the padding object is passed as the first parameter

Parameters

callback? (object: T) => voidThe callback function to bind default: undefined

Returns

Tween<T>The current interval object can be called in a chain like manner

Precautions

  1. Not triggered during normal completion.
  2. Trigger only after stopping any possible link patching.

onUpdate

onUpdate(callback?): Tween<T> other

Triggered every time there is a gap update, the gap object is passed as the first parameter

Parameters

callback? (object: T, elapsed: number) => voidThe callback function to bind default: undefined

Returns

Tween<T>The current interval object can be called in a chain like manner

Precautions

When the callback is triggered, the property has been update.


pause

pause(time?): Tween<T> other

Pause for time compensation. You can specify the effective time of pause. The default is the current time

Parameters

time? numberPause effective time default: current time
range: [0,+∞] type: floating point number

Returns

Tween<T>The current interval object can be called in a chain like manner

Precautions

Accept a parameter 'time'. If you use it, the pause will not take effect immediately until a specific moment, otherwise it will pause as soon as possible (i.e. on the next call to update)


repeat

repeat(times?): Tween<T> other

Set the number of repetitions, and the total number of intervals will be the repetition parameter plus an initial interval

Parameters

times? numberRepeat count default: 0
range: [0,+∞] type: floating-point number

Returns

Tween<T>The current interval object can be called in a chain like manner

Precautions

Will reset the current number of repetitions

Usage example: example

ts
tween.repeat(10) // Cycle 10 times
tween.repeat(Infinity) // Infinite loop
tween.repeat(10) // Cycle 10 times
tween.repeat(Infinity) // Infinite loop

repeatDelay

repeatDelay(amount?): Tween<T> other

Set the delay start time for repeated interval filling

Parameters

amount? numberDelay time, unit: ms. Default: undefined type: floating point range: [0,+∞]

Returns

Tween<T>The current interval object can be called in a chain like manner

Range

: [0, +∞]


resume

resume(time?): Tween<T> other

The effective time of redo can be specified. The default is the current time

Parameters

time? numberRedo effective time default: current time
range: [0,+∞] type: floating point number

Returns

Tween<T>The current interval object can be called in a chain like manner

Precautions

Accept a parameter 'time'. If you use it, redo will not take effect immediately until a specific time, otherwise redo will be performed as soon as possible (i.e., the next call update)


start

start(time?): Tween<T> other

Start time compensation. You can specify the start effective time. The default is the current time

Parameters

time? numberStart effective time default: current time
range: [0,+∞] type: floating point number

Returns

Tween<T>The current interval object can be called in a chain like manner

Precautions

Accept a parameter 'time'. If you use it, the patching will not start immediately until a specific time, otherwise it will start as soon as possible (i.e., the next call update)


stop

stop(): Tween<T> other

Stopping a gap, stopping a gap that has never started or has already stopped, has no effect. No errors were thrown

Returns

Tween<T>The current interval object can be called in a chain like manner

stopChainedTweens

stopChainedTweens(): Tween<T> other

Stop all gap objects linked to the current gap

Returns

Tween<T>The current interval object can be called in a chain like manner

to

to(properties, duration?): Tween<T> other

Set the target status of the supplementary room and the time required to complete the supplementary room

Parameters

properties TweenUnknownPropsThe target status can be an array: for example, to ([0100200], time)
duration? numberThe time required to complete the gap, in milliseconds. Default: 1000
range: [0,+∞] type: floating-point number

Returns

Tween<T>The current interval object can be called in a chain like manner

update

update(time?, autoStart?): boolean other

Update the current supplementary room. Generally speaking, it will be automatically call by the affiliated compensation group, without manually call.

Parameters

time? numberThe callback function to bind default: current time
range: [0,+∞] type: floating-point number
autoStart? booleanAutomatically start default: true

Returns

booleanTrue - if the current update has not ended, false - the end of the remediation after the current update

yoyo

yoyo(yoyo?): Tween<T> other

Set reciprocating (yo yo effect)

Parameters

yoyo? booleanEnable yoyo default: false

Returns

Tween<T>The current interval object can be called in a chain like manner

This feature only works when using repeat alone.

After enable, the behavior of space filling will be like a yo yo sphere, which will reciprocate between the start value and the end value instead of repeating from the beginning.