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
T | extends 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
T | extends TweenUnknownProps |
---|
Parameters
obj T | The object type to create the space |
---|---|
group? false TweenGroup | Grouping 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
// 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? number | Delay 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? number | The 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? TweenEasingFunction | Slow 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
number | The ID of the current supplementary object |
---|
group
• group(group?
): Tween
<T
> other
Set the grouping of the current gap object
Parameters
group? TweenGroup | New 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? TweenInterpolationFunction | Interpolation 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
boolean | True 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
boolean | True - 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 ) => void | The 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 ) => void | The 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 ) => void | The callback function to bind default: undefined |
---|
Returns
Tween <T > | The current interval object can be called in a chain like manner |
---|
Precautions
- Execute before the start of the interval, i.e. before the calculation.
- 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 ) => void | The callback function to bind default: undefined |
---|
Returns
Tween <T > | The current interval object can be called in a chain like manner |
---|
Precautions
- Not triggered during normal completion.
- 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 ) => void | The 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? number | Pause 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? number | Repeat 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
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? number | Delay 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? number | Redo 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? number | Start 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 TweenUnknownProps | The target status can be an array: for example, to ([0100200], time) |
---|---|
duration? number | The 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? number | The callback function to bind default: current time range: [0,+∞] type: floating-point number |
---|---|
autoStart? boolean | Automatically start default: true |
Returns
boolean | True - 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? boolean | Enable 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.