|
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html lang="en">
|
|
|
|
|
<head>
|
|
|
|
|
<meta charset="utf-8" />
|
|
|
|
|
<base href="../../../" />
|
|
|
|
|
<script src="page.js"></script>
|
|
|
|
|
<link type="text/css" rel="stylesheet" href="page.css" />
|
|
|
|
|
</head>
|
|
|
|
|
<body>
|
|
|
|
|
<h1>[name]</h1>
|
|
|
|
|
|
|
|
|
|
<p class="desc">
|
|
|
|
|
AnimationActions schedule the performance of the animations which are
|
|
|
|
|
stored in [page:AnimationClip AnimationClips].<br /><br />
|
|
|
|
|
|
|
|
|
|
Note: Most of AnimationAction's methods can be chained.<br /><br />
|
|
|
|
|
|
|
|
|
|
For an overview of the different elements of the three.js animation system
|
|
|
|
|
see the "Animation System" article in the "Next Steps" section of the
|
|
|
|
|
manual.
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h2>Constructor</h2>
|
|
|
|
|
|
|
|
|
|
<h3>
|
|
|
|
|
[name]( [param:AnimationMixer mixer], [param:AnimationClip clip],
|
|
|
|
|
[param:Object3D localRoot] )
|
|
|
|
|
</h3>
|
|
|
|
|
<p>
|
|
|
|
|
[page:AnimationMixer mixer] - the `AnimationMixer` that is controlled by
|
|
|
|
|
this action.<br />
|
|
|
|
|
[page:AnimationClip clip] - the `AnimationClip` that holds the animation
|
|
|
|
|
data for this action.<br />
|
|
|
|
|
[page:Object3D localRoot] - the root object on which this action is
|
|
|
|
|
performed.<br />
|
|
|
|
|
[page:Number blendMode] - defines how the animation is blended/combined
|
|
|
|
|
when two or more animations are simultaneously played.<br /><br />
|
|
|
|
|
|
|
|
|
|
Note: Instead of calling this constructor directly you should instantiate
|
|
|
|
|
an AnimationAction with [page:AnimationMixer.clipAction] since this method
|
|
|
|
|
provides caching for better performance.
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h2>Properties</h2>
|
|
|
|
|
|
|
|
|
|
<h3>[property:Number blendMode]</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Defines how the animation is blended/combined when two or more animations
|
|
|
|
|
are simultaneously played. Valid values are *NormalAnimationBlendMode*
|
|
|
|
|
(default) and *AdditiveAnimationBlendMode*.
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[property:Boolean clampWhenFinished]</h3>
|
|
|
|
|
<p>
|
|
|
|
|
If `clampWhenFinished` is set to true the animation will automatically be
|
|
|
|
|
[page:.paused paused] on its last frame.<br /><br />
|
|
|
|
|
|
|
|
|
|
If `clampWhenFinished` is set to false, [page:.enabled enabled] will
|
|
|
|
|
automatically be switched to false when the last loop of the action has
|
|
|
|
|
finished, so that this action has no further impact.<br /><br />
|
|
|
|
|
|
|
|
|
|
Default is `false`.<br /><br />
|
|
|
|
|
|
|
|
|
|
Note: `clampWhenFinished` has no impact if the action is interrupted (it
|
|
|
|
|
has only an effect if its last loop has really finished).
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[property:Boolean enabled]</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Setting `enabled` to `false` disables this action, so that it has no
|
|
|
|
|
impact. Default is `true`.<br /><br />
|
|
|
|
|
|
|
|
|
|
When the action is re-enabled, the animation continues from its current
|
|
|
|
|
[page:.time time] (setting `enabled` to `false` doesn't reset the
|
|
|
|
|
action).<br /><br />
|
|
|
|
|
|
|
|
|
|
Note: Setting `enabled` to `true` doesn’t automatically restart the
|
|
|
|
|
animation. Setting `enabled` to `true` will only restart the animation
|
|
|
|
|
immediately if the following condition is fulfilled: [page:.paused paused]
|
|
|
|
|
is `false`, this action has not been deactivated in the meantime (by
|
|
|
|
|
executing a [page:.stop stop] or [page:.reset reset] command), and neither
|
|
|
|
|
[page:.weight weight] nor [page:.timeScale timeScale] is `0`.
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[property:Number loop]</h3>
|
|
|
|
|
<p>
|
|
|
|
|
The looping mode (can be changed with [page:.setLoop setLoop]). Default is
|
|
|
|
|
[page:Animation THREE.LoopRepeat] (with an infinite number of
|
|
|
|
|
[page:.repetitions repetitions])<br /><br />
|
|
|
|
|
|
|
|
|
|
Must be one of these constants:<br /><br />
|
|
|
|
|
[page:Animation THREE.LoopOnce] - playing the clip once,<br />
|
|
|
|
|
[page:Animation THREE.LoopRepeat] - playing the clip with the chosen
|
|
|
|
|
number of `repetitions`, each time jumping from the end of the clip
|
|
|
|
|
directly to its beginning,<br />
|
|
|
|
|
[page:Animation THREE.LoopPingPong] - playing the clip with the chosen
|
|
|
|
|
number of `repetitions`, alternately playing forward and backward.
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[property:Boolean paused]</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Setting `paused` to `true` pauses the execution of the action by setting
|
|
|
|
|
the effective time scale to `0`. Default is `false`.<br /><br />
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[property:Number repetitions]</h3>
|
|
|
|
|
<p>
|
|
|
|
|
The number of repetitions of the performed [page:AnimationClip] over the
|
|
|
|
|
course of this action. Can be set via [page:.setLoop setLoop]. Default is
|
|
|
|
|
`Infinity`.<br /><br />
|
|
|
|
|
Setting this number has no effect, if the [page:.loop loop mode] is set to
|
|
|
|
|
[page:Animation THREE.LoopOnce].
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[property:Number time]</h3>
|
|
|
|
|
<p>
|
|
|
|
|
The local time of this action (in seconds, starting with `0`).<br /><br />
|
|
|
|
|
|
|
|
|
|
The value gets clamped or wrapped to `0...clip.duration` (according to the
|
|
|
|
|
loop state). It can be scaled relatively to the global mixer time by
|
|
|
|
|
changing [page:.timeScale timeScale] (using [page:.setEffectiveTimeScale setEffectiveTimeScale] or [page:.setDuration setDuration]).<br />
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[property:Number timeScale]</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Scaling factor for the [page:.time time]. A value of `0` causes the
|
|
|
|
|
animation to pause. Negative values cause the animation to play backwards.
|
|
|
|
|
Default is `1`.<br /><br />
|
|
|
|
|
Properties/methods concerning `timeScale` (respectively `time`) are:
|
|
|
|
|
[page:.getEffectiveTimeScale getEffectiveTimeScale],
|
|
|
|
|
[page:.halt halt],
|
|
|
|
|
[page:.paused paused],
|
|
|
|
|
[page:.setDuration setDuration],
|
|
|
|
|
[page:.setEffectiveTimeScale setEffectiveTimeScale],
|
|
|
|
|
[page:.stopWarping stopWarping],
|
|
|
|
|
[page:.syncWith syncWith],
|
|
|
|
|
[page:.warp warp].
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[property:Number weight]</h3>
|
|
|
|
|
<p>
|
|
|
|
|
The degree of influence of this action (in the interval `[0, 1]`). Values
|
|
|
|
|
between `0` (no impact) and `1` (full impact) can be used to blend between
|
|
|
|
|
several actions. Default is `1`. <br /><br />
|
|
|
|
|
Properties/methods concerning `weight` are:
|
|
|
|
|
[page:.crossFadeFrom crossFadeFrom],
|
|
|
|
|
[page:.crossFadeTo crossFadeTo],
|
|
|
|
|
[page:.enabled enabled],
|
|
|
|
|
[page:.fadeIn fadeIn],
|
|
|
|
|
[page:.fadeOut fadeOut],
|
|
|
|
|
[page:.getEffectiveWeight getEffectiveWeight],
|
|
|
|
|
[page:.setEffectiveWeight setEffectiveWeight],
|
|
|
|
|
[page:.stopFading stopFading].
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[property:Boolean zeroSlopeAtEnd]</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Enables smooth interpolation without separate clips for start, loop and
|
|
|
|
|
end. Default is `true`.
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[property:Boolean zeroSlopeAtStart]</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Enables smooth interpolation without separate clips for start, loop and
|
|
|
|
|
end. Default is `true`.
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h2>Methods</h2>
|
|
|
|
|
|
|
|
|
|
<h3>
|
|
|
|
|
[method:this crossFadeFrom]( [param:AnimationAction fadeOutAction], [param:Number durationInSeconds], [param:Boolean warpBoolean] )
|
|
|
|
|
</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Causes this action to [page:.fadeIn fade in], fading out another action
|
|
|
|
|
simultaneously, within the passed time interval. This method can be
|
|
|
|
|
chained.<br /><br />
|
|
|
|
|
|
|
|
|
|
If warpBoolean is true, additional [page:.warp warping] (gradually changes
|
|
|
|
|
of the time scales) will be applied.<br /><br />
|
|
|
|
|
|
|
|
|
|
Note: Like with `fadeIn`/`fadeOut`, the fading starts/ends with a weight
|
|
|
|
|
of `1`.
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>
|
|
|
|
|
[method:this crossFadeTo]( [param:AnimationAction fadeInAction], [param:Number durationInSeconds], [param:Boolean warpBoolean] )
|
|
|
|
|
</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Causes this action to [page:.fadeOut fade out], fading in another action
|
|
|
|
|
simultaneously, within the passed time interval. This method can be
|
|
|
|
|
chained.<br /><br />
|
|
|
|
|
If warpBoolean is true, additional [page:.warp warping] (gradually changes
|
|
|
|
|
of the time scales) will be applied.<br /><br />
|
|
|
|
|
|
|
|
|
|
Note: Like with `fadeIn`/`fadeOut`, the fading starts/ends with a weight
|
|
|
|
|
of `1`.
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[method:this fadeIn]( [param:Number durationInSeconds] )</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Increases the [page:.weight weight] of this action gradually from `0` to
|
|
|
|
|
`1`, within the passed time interval. This method can be chained.
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[method:this fadeOut]( [param:Number durationInSeconds] )</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Decreases the [page:.weight weight] of this action gradually from `1` to
|
|
|
|
|
`0`, within the passed time interval. This method can be chained.
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[method:Number getEffectiveTimeScale]()</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Returns the effective time scale (considering the current states of
|
|
|
|
|
warping and [page:.paused paused]).
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[method:Number getEffectiveWeight]()</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Returns the effective weight (considering the current states of fading and
|
|
|
|
|
[page:.enabled enabled]).
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[method:AnimationClip getClip]()</h3>
|
|
|
|
|
<p>Returns the clip which holds the animation data for this action.</p>
|
|
|
|
|
|
|
|
|
|
<h3>[method:AnimationMixer getMixer]()</h3>
|
|
|
|
|
<p>Returns the mixer which is responsible for playing this action.</p>
|
|
|
|
|
|
|
|
|
|
<h3>[method:Object3D getRoot]()</h3>
|
|
|
|
|
<p>Returns the root object on which this action is performed.</p>
|
|
|
|
|
|
|
|
|
|
<h3>[method:this halt]( [param:Number durationInSeconds] )</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Decelerates this animation's speed to `0` by decreasing [page:.timeScale timeScale] gradually (starting from its current value), within the passed
|
|
|
|
|
time interval. This method can be chained.
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[method:Boolean isRunning]()</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Returns true if the action’s [page:.time time] is currently running.<br /><br />
|
|
|
|
|
|
|
|
|
|
In addition to being activated in the mixer (see [page:.isScheduled isScheduled]) the following conditions must be fulfilled: [page:.paused paused] is equal to false, [page:.enabled enabled] is equal to true,
|
|
|
|
|
[page:.timeScale timeScale] is different from `0`, and there is no
|
|
|
|
|
scheduling for a delayed start ([page:.startAt startAt]).<br /><br />
|
|
|
|
|
|
|
|
|
|
Note: `isRunning` being true doesn’t necessarily mean that the animation
|
|
|
|
|
can actually be seen. This is only the case, if [page:.weight weight] is
|
|
|
|
|
additionally set to a non-zero value.
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[method:Boolean isScheduled]()</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Returns true, if this action is activated in the mixer.<br /><br />
|
|
|
|
|
Note: This doesn’t necessarily mean that the animation is actually running
|
|
|
|
|
(compare the additional conditions for [page:.isRunning isRunning]).
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[method:this play]()</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Tells the mixer to activate the action. This method can be chained.<br /><br />
|
|
|
|
|
|
|
|
|
|
Note: Activating this action doesn’t necessarily mean that the animation
|
|
|
|
|
starts immediately: If the action had already finished before (by reaching
|
|
|
|
|
the end of its last loop), or if a time for a delayed start has been set
|
|
|
|
|
(via [page:.startAt startAt]), a [page:.reset reset] must be executed
|
|
|
|
|
first. Some other settings ([page:.paused paused]=true, [page:.enabled enabled]=false, [page:.weight weight]=0, [page:.timeScale timeScale]=0)
|
|
|
|
|
can prevent the animation from playing, too.
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[method:this reset]()</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Resets the action. This method can be chained.<br /><br />
|
|
|
|
|
|
|
|
|
|
This method sets [page:.paused paused] to false, [page:.enabled enabled]
|
|
|
|
|
to true, [page:.time time] to `0`, interrupts any scheduled fading and
|
|
|
|
|
warping, and removes the internal loop count and scheduling for delayed
|
|
|
|
|
starting.<br /><br />
|
|
|
|
|
|
|
|
|
|
Note: .`reset` is always called by [page:.stop stop], but .`reset` doesn’t
|
|
|
|
|
call .`stop` itself. This means: If you want both, resetting and stopping,
|
|
|
|
|
don’t call .`reset`; call .`stop` instead.
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[method:this setDuration]( [param:Number durationInSeconds] )</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Sets the duration for a single loop of this action (by adjusting
|
|
|
|
|
[page:.timeScale timeScale] and stopping any scheduled warping). This
|
|
|
|
|
method can be chained.
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[method:this setEffectiveTimeScale]( [param:Number timeScale] )</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Sets the [page:.timeScale timeScale] and stops any scheduled warping. This
|
|
|
|
|
method can be chained.<br /><br />
|
|
|
|
|
|
|
|
|
|
If [page:.paused paused] is false, the effective time scale (an internal
|
|
|
|
|
property) will also be set to this value; otherwise the effective time
|
|
|
|
|
scale (directly affecting the animation at this moment) will be set to
|
|
|
|
|
`0`.<br /><br />
|
|
|
|
|
|
|
|
|
|
Note: .`paused` will not be switched to `true` automatically, if
|
|
|
|
|
.`timeScale` is set to `0` by this method.
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[method:this setEffectiveWeight]( [param:Number weight] )</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Sets the [page:.weight weight] and stops any scheduled fading. This method
|
|
|
|
|
can be chained.<br /><br />
|
|
|
|
|
|
|
|
|
|
If [page:.enabled enabled] is true, the effective weight (an internal
|
|
|
|
|
property) will also be set to this value; otherwise the effective weight
|
|
|
|
|
(directly affecting the animation at this moment) will be set to `0`.<br /><br />
|
|
|
|
|
|
|
|
|
|
Note: .`enabled` will not be switched to `false` automatically, if
|
|
|
|
|
.`weight` is set to `0` by this method.
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>
|
|
|
|
|
[method:this setLoop]( [param:Number loopMode], [param:Number repetitions])
|
|
|
|
|
</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Sets the [page:.loop loop mode] and the number of [page:.repetitions repetitions]. This method can be chained.
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[method:this startAt]( [param:Number startTimeInSeconds] )</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Defines the time for a delayed start (usually passed as
|
|
|
|
|
[page:AnimationMixer.time] + deltaTimeInSeconds). This method can be
|
|
|
|
|
chained.<br /><br />
|
|
|
|
|
|
|
|
|
|
Note: The animation will only start at the given time, if .`startAt` is
|
|
|
|
|
chained with [page:.play play], or if the action has already been
|
|
|
|
|
activated in the mixer (by a previous call of .`play`, without stopping or
|
|
|
|
|
resetting it in the meantime).
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[method:this stop]()</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Tells the mixer to deactivate this action. This method can be chained.<br /><br />
|
|
|
|
|
|
|
|
|
|
The action will be immediately stopped and completely [page:.reset reset].<br /><br />
|
|
|
|
|
|
|
|
|
|
Note: You can stop all active actions on the same mixer in one go via
|
|
|
|
|
[page:AnimationMixer.stopAllAction mixer.stopAllAction].
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[method:this stopFading]()</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Stops any scheduled [page:.fadeIn fading] which is applied to this action.
|
|
|
|
|
This method can be chained.
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[method:this stopWarping]()</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Stops any scheduled [page:.warp warping] which is applied to this action.
|
|
|
|
|
This method can be chained.
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>[method:this syncWith]( [param:AnimationAction otherAction] )</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Synchronizes this action with the passed other action. This method can be
|
|
|
|
|
chained.<br /><br />
|
|
|
|
|
|
|
|
|
|
Synchronizing is done by setting this action’s [page:.time time] and
|
|
|
|
|
[page:.timeScale timeScale] values to the corresponding values of the
|
|
|
|
|
other action (stopping any scheduled warping).<br /><br />
|
|
|
|
|
|
|
|
|
|
Note: Future changes of the other action's `time` and `timeScale` will not
|
|
|
|
|
be detected.
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h3>
|
|
|
|
|
[method:this warp]( [param:Number startTimeScale], [param:Number endTimeScale], [param:Number durationInSeconds] )
|
|
|
|
|
</h3>
|
|
|
|
|
<p>
|
|
|
|
|
Changes the playback speed, within the passed time interval, by modifying
|
|
|
|
|
[page:.timeScale timeScale] gradually from `startTimeScale` to
|
|
|
|
|
`endTimeScale`. This method can be chained.
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<h2>Events</h2>
|
|
|
|
|
|
|
|
|
|
<p class="desc">
|
|
|
|
|
There are two events indicating when a single loop of the action
|
|
|
|
|
respectively the entire action has finished. You can react to them with:
|
|
|
|
|
</p>
|
|
|
|
|
<code>
|
|
|
|
|
mixer.addEventListener( 'loop', function( e ) { …} ); // properties of e: type, action and loopDelta
|
|
|
|
|
mixer.addEventListener( 'finished', function( e ) { …} ); // properties of e: type, action and direction
|
|
|
|
|
</code>
|
|
|
|
|
|
|
|
|
|
<h2>Source</h2>
|
|
|
|
|
|
|
|
|
|
<p>
|
|
|
|
|
[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
|
|
|
|
|
</p>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|