2
0

AnimationAction.html 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8" />
  5. <base href="../../" />
  6. <script src="list.js"></script>
  7. <script src="page.js"></script>
  8. <link type="text/css" rel="stylesheet" href="page.css" />
  9. </head>
  10. <body>
  11. <h1>[name]</h1>
  12. <div class="desc">
  13. AnimationActions schedule the performance of the animations which are stored in
  14. [page:AnimationClip AnimationClips].<br /><br />
  15. Note: Most of AnimationAction's methods can be chained.<br /><br />
  16. For an overview of the different elements of the three.js animation system see the
  17. "Animation System" article in the "Next Steps" section of the manual.
  18. </div>
  19. <h2>Constructor</h2>
  20. <h3>[name]( [page:AnimationMixer mixer], [page:AnimationClip clip], [page:Object3D localRoot] )</h3>
  21. <div>
  22. [page:AnimationMixer mixer] - the *AnimationMixer* that is controlled by this action.<br />
  23. [page:AnimationClip clip] - the *AnimationClip* that holds the animation data for this action.<br />
  24. [page:Object3D localRoot] - the root object on which this action is performed.<br /><br />
  25. Note: Instead of calling this constructor directly you should instantiate an AnimationAction with
  26. [page:AnimationMixer.clipAction] since this method provides caching for better performance.
  27. </div>
  28. <h2>Properties</h2>
  29. <h3>[property:Boolean clampWhenFinished]</h3>
  30. <div>
  31. If *clampWhenFinished* is set to true the animation will automatically be [page:.paused paused]
  32. on its last frame.<br /><br />
  33. If *clampWhenFinished* is set to false, [page:.enabled enabled] will automatically be switched
  34. to false when the last loop of the action has finished, so that this action has no further
  35. impact.<br /><br />
  36. Default is false.<br /><br />
  37. Note: *clampWhenFinished* has no impact if the action is interrupted (it has only an effect if
  38. its last loop has really finished).
  39. </div>
  40. <h3>[property:Boolean enabled]</h3>
  41. <div>
  42. Setting *enabled* to *false* disables this action, so that it has no impact. Default is *true*.<br /><br />
  43. When the action is re-enabled, the animation continues from its current [page:.time time]
  44. (setting *enabled* to *false* doesn't reset the action).<br /><br />
  45. Note: Setting *enabled* to *true* doesn’t automatically restart the animation. Setting *enabled*
  46. to *true* will only restart the animation immediately if the following condition is fulfilled:
  47. [page:.paused paused] is *false*, this action has not been deactivated in the meantime (by
  48. executing a [page:.stop stop] or [page:.reset reset] command), and neither [page:.weight weight]
  49. nor [page:.timeScale timeScale] is 0.
  50. </div>
  51. <h3>[property:Number loop]</h3>
  52. <div>
  53. The looping mode (can be changed with [page:.setLoop setLoop]). Default is
  54. [page:Animation THREE.LoopRepeat] (with an infinite number of [page:.repetitions repetitions])<br /><br />
  55. Must be one of these constants:<br /><br />
  56. [page:Animation THREE.LoopOnce] - playing the clip once,<br />
  57. [page:Animation THREE.LoopRepeat] - playing the clip with the choosen number of *repetitions*,
  58. each time jumping from the end of the clip directly to its beginning,<br />
  59. [page:Animation THREE.LoopPingPong] - playing the clip with the choosen number of *repetitions*,
  60. alternately playing forward and backward.
  61. </div>
  62. <h3>[property:Boolean paused]</h3>
  63. <div>
  64. Setting *paused* to *true* pauses the execution of the action by setting the effective time scale
  65. to 0. Default is *false*.<br /><br />
  66. </div>
  67. <h3>[property:Number repetitions]</h3>
  68. <div>
  69. The number of repetitions of the performed [page:AnimationClip] over the course of this action.
  70. Can be set via [page:.setLoop setLoop]. Default is *Infinity*.<br /><br />
  71. Setting this number has no effect, if the [page:.loop loop mode] is set to
  72. [page:Animation THREE.LoopOnce].<br /><br />
  73. Note: The first run is not taken into account. For example: if *repetition* is set to 2, the
  74. total number of executed rounds will be 3.
  75. </div>
  76. <h3>[property:Number time]</h3>
  77. <div>
  78. The local time of this action (in seconds, starting with 0).<br /><br />
  79. The value gets clamped or wrapped to 0...clip.duration (according to the loop state). It can be
  80. scaled relativly to the global mixer time by changing [page:.timeScale timeScale] (using
  81. [page:.setEffectiveTimeScale setEffectiveTimeScale] or [page:.setDuration setDuration]).<br />
  82. </div>
  83. <h3>[property:Number timeScale]</h3>
  84. <div>
  85. Scaling factor for the [page:.time time]. A value of 0 causes the animation to pause. Negative
  86. values cause the animation to play backwards. Default is 1.<br /><br />
  87. Properties/methods concerning *timeScale* (respectively *time*) are:
  88. [page:.getEffectiveTimeScale getEffectiveTimeScale],
  89. [page:.halt halt],
  90. [page:.paused paused],
  91. [page:.setDuration setDuration],
  92. [page:.setEffectiveTimeScale setEffectiveTimeScale],
  93. [page:.stopWarping stopWarping],
  94. [page:.syncWith syncWith],
  95. [page:.warp warp].
  96. </div>
  97. <h3>[property:Number weight]</h3>
  98. <div>
  99. The degree of influence of this action (in the interval [0, 1]). Values between 0 (no impact)
  100. and 1 (full impact) can be used to blend between several actions. Default is 1. <br /><br />
  101. Properties/methods concerning *weight* are:
  102. [page:.crossFadeFrom crossFadeFrom],
  103. [page:.crossFadeTo crossFadeTo],
  104. [page:.enabled enabled],
  105. [page:.fadeIn fadeIn],
  106. [page:.fadeOut fadeOut],
  107. [page:.getEffectiveWeight getEffectiveWeight],
  108. [page:.setEffectiveWeight setEffectiveWeight],
  109. [page:.stopFading stopFading].
  110. </div>
  111. <h3>[property:Boolean zeroSlopeAtEnd]</h3>
  112. <div>
  113. Enables smooth interpolation without separate clips for start, loop and end. Default is *true*.
  114. </div>
  115. <h3>[property:Boolean zeroSlopeAtStart]</h3>
  116. <div>
  117. Enables smooth interpolation without separate clips for start, loop and end. Default is *true*.
  118. </div>
  119. <h2>Methods</h2>
  120. <h3>[method:AnimationAction crossFadeFrom]( [page:AnimationAction fadeOutAction], [page:Number durationInSeconds], [page:Boolean warpBoolean] )</h3>
  121. <div>
  122. Causes this action to [page:.fadeIn fade in], fading out another action simultaneously, within
  123. the passed time interval. This method can be chained.<br /><br />
  124. If warpBoolean is true, additional [page:.warp warping] (gradually changes of the time scales)
  125. will be applied.<br /><br />
  126. Note: Like with *fadeIn*/*fadeOut*, the fading starts/ends with a weight of 1.
  127. </div>
  128. <h3>[method:AnimationAction crossFadeTo]( [page:AnimationAction fadeInAction], [page:Number durationInSeconds], [page:Boolean warpBoolean] )</h3>
  129. <div>
  130. Causes this action to [page:.fadeOut fade out], fading in another action simultaneously, within
  131. the passed time interval. This method can be chained.<br /><br />
  132. If warpBoolean is true, additional [page:.warp warping] (gradually changes of the time scales)
  133. will be applied.<br /><br />
  134. Note: Like with *fadeIn*/*fadeOut*, the fading starts/ends with a weight of 1.
  135. </div>
  136. <h3>[method:AnimationAction fadeIn]( [page:Number durationInSeconds] )</h3>
  137. <div>
  138. Increases the [page:.weight weight] of this action gradually from 0 to 1, within the passed time
  139. interval. This method can be chained.
  140. </div>
  141. <h3>[method:AnimationAction fadeOut]( [page:Number durationInSeconds] )</h3>
  142. <div>
  143. Decreases the [page:.weight weight] of this action gradually from 1 to 0, within the passed time
  144. interval. This method can be chained.
  145. </div>
  146. <h3>[method:Number getEffectiveTimeScale]()</h3>
  147. <div>
  148. Returns the effective time scale (considering the current states of warping and
  149. [page:.paused paused]).
  150. </div>
  151. <h3>[method:number getEffectiveWeight]()</h3>
  152. <div>
  153. Returns the effective weight (considering the current states of fading and
  154. [page:.enabled enabled]).
  155. </div>
  156. <h3>[method:AnimationClip getClip]()</h3>
  157. <div>
  158. Returns the clip which holds the animation data for this action.
  159. </div>
  160. <h3>[method:AnimationMixer getMixer]()</h3>
  161. <div>
  162. Returns the mixer which is responsible for playing this action.
  163. </div>
  164. <h3>[method:Object3D getRoot]()</h3>
  165. <div>
  166. Returns the root object on which this action is performed.
  167. </div>
  168. <h3>[method:AnimationAction halt]( [page:Number durationInSeconds] )</h3>
  169. <div>
  170. Decelerates this animation's speed to 0 by decreasing [page:.timeScale timeScale] gradually
  171. (starting from its current value), within the passed time interval. This method can be chained.
  172. </div>
  173. <h3>[method:Boolean isRunning]()</h3>
  174. <div>
  175. Returns true if this action is activated in the mixer and currently playing (as opposed to
  176. [page:.isScheduled isScheduled]).<br /><br />
  177. In addition to being activated in the mixer the following conditions must be fulfilled:
  178. [page:.paused paused] is equal to false, [page:.enabled enabled] is equal to true,
  179. [page:.timeScale timeScale] is different from 0, and there is no scheduling for a delayed start
  180. ([page:.startAt startAt]).
  181. </div>
  182. <h3>[method:Boolean isScheduled]()</h3>
  183. <div>
  184. Returns true, if this action is activated in the mixer.<br /><br />
  185. Note: This doesn’t necessarily mean that the animation is actually running (compare the additional
  186. conditions for [page:.isRunning isRunning]).
  187. </div>
  188. <h3>[method:AnimationAction play]()</h3>
  189. <div>
  190. Tells the mixer to activate the action. This method can be chained.<br /><br />
  191. Note: Activating this action doesn’t necessarily mean that the animation starts immediately:
  192. If the action had already finished before (by reaching the end of its last loop), or if a time
  193. for a delayed start has been set (via [page:.startAt startAt]), a [page:.reset reset] must be
  194. executed first. Some other settings ([page:.paused paused]=true, [page:.enabled enabled]=false,
  195. [page:.weight weight]=0, [page:.timeScale timeScale]=0) can prevent the animation from playing,
  196. too.
  197. </div>
  198. <h3>[method:AnimationAction reset]()</h3>
  199. <div>
  200. Resets the action. This method can be chained.<br /><br />
  201. This method sets [page:.paused paused] to false, [page:.enabled enabled] to true,
  202. [page:.time time] to 0, interrupts any scheduled fading and warping, and removes the internal
  203. loop count and scheduling for delayed starting.<br /><br />
  204. Note: .*reset* is always called by [page:.stop stop], but .*reset* doesn’t call .*stop* itself.
  205. This means: If you want both, resetting and stopping, don’t call .*reset*; call .*stop* instead.
  206. </div>
  207. <h3>[method:AnimationAction setDuration]( [page:Number durationInSeconds] )</h3>
  208. <div>
  209. Sets the duration for a single loop of this action (by adjusting [page:.timeScale timeScale]
  210. and stopping any scheduled warping). This method can be chained.
  211. </div>
  212. <h3>[method:AnimationAction setEffectiveTimeScale]( [page:Number timeScale] )</h3>
  213. <div>
  214. Sets the [page:.timeScale timeScale] and stops any scheduled warping. This method can be chained.<br /><br />
  215. If [page:.paused paused] is false, the effective time scale (an internal property) will also be set
  216. to this value; otherwise the effective time scale (directly affecting the animation at
  217. this moment) will be set to 0.<br /><br />
  218. Note: .*paused* will not be switched to *true* automatically, if .*timeScale* is set to 0 by
  219. this method.
  220. </div>
  221. <h3>[method:AnimationAction setEffectiveWeight]( [page:Number weight] )</h3>
  222. <div>
  223. Sets the [page:.weight weight] and stops any scheduled fading. This method can be chained.<br /><br />
  224. If [page:.enabled enabled] is true, the effective weight (an internal property) will also be set
  225. to this value; otherwise the effective weight (directly affecting the animation at this moment)
  226. will be set to 0.<br /><br />
  227. Note: .*enabled* will not be switched to *false* automatically, if .*weight* is set to 0 by
  228. this method.
  229. </div>
  230. <h3>[method:AnimationAction setLoop]( [page:Number loopMode], [page:Number repetitions] )</h3>
  231. <div>
  232. Sets the [page:.loop loop mode] and the number of [page:.repetitions repetitions]. This method
  233. can be chained.
  234. </div>
  235. <h3>[method:AnimationAction startAt]( [page:Number startTimeInSeconds] )</h3>
  236. <div>
  237. Defines the time for a delayed start (usually passed as [page:AnimationMixer.time] +
  238. deltaTimeInSeconds). This method can be chained.<br /><br />
  239. Note: The animation will only start at the given time, if .*startAt* is chained with
  240. [page:.play play], or if the action has already been activated in the mixer (by a previous
  241. call of .*play*, without stopping or resetting it in the meantime).
  242. </div>
  243. <h3>[method:AnimationAction stop]()</h3>
  244. <div>
  245. Tells the mixer to deactivate this action. This method can be chained.<br /><br />
  246. The action will be immediately stopped and completely [page:.reset reset].<br /><br />
  247. Note: You can stop all active actions on the same mixer in one go via
  248. [page:AnimationMixer.stopAllAction mixer.stopAllAction].
  249. </div>
  250. <h3>[method:AnimationAction stopFading]()</h3>
  251. <div>
  252. Stops any scheduled [page:.fadeIn fading] which is applied to this action. This method can be
  253. chained.
  254. </div>
  255. <h3>[method:AnimationAction stopWarping]()</h3>
  256. <div>
  257. Stops any scheduled [page:.warp warping] which is applied to this action. This method can be
  258. chained.
  259. </div>
  260. <h3>[method:AnimationAction syncWith]( [page:AnimationAction otherAction] )</h3>
  261. <div>
  262. Synchronizes this action with the passed other action. This method can be chained.<br /><br />
  263. Synchronizing is done by setting this action’s [page:.time time] and [page:.timeScale timeScale] values
  264. to the corresponding values of the other action (stopping any scheduled warping).<br /><br />
  265. Note: Future changes of the other action's *time* and *timeScale* will not be detected.
  266. </div>
  267. <h3>[method:AnimationAction warp]( [page:Number startTimeScale], [page:Number endTimeScale], [page:Number durationInSeconds] )</h3>
  268. <div>
  269. Changes the playback speed, within the passed time interval, by modifying
  270. [page:.timeScale timeScale] gradually from *startTimeScale* to *endTimeScale*. This method can
  271. be chained.
  272. </div>
  273. <h2>Events</h2>
  274. <div class="desc">
  275. There are two events indicating when a single loop of the action respectively the entire action has finished. You can react to them with:
  276. </div>
  277. <code>
  278. mixer.addEventListener( 'loop', function( e ) { …} ); // properties of e: type, action and loopDelta
  279. mixer.addEventListener( 'finished', function( e ) { …} ); // properties of e: type, action and direction
  280. </code>
  281. <h2>Source</h2>
  282. [link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]
  283. </body>
  284. </html>