BufferGeometry
Object3D
Raycaster
Camera
CubeCamera
PerspectiveCamera
OrthographicCamera
StereoCamera
Clock
Curve
CurvePath
Path
Shape
ShapePath
ArrowHelper
AxesHelper
BoxHelper
Box3Helper
CameraHelper
DirectionalLightHelper
GridHelper
PolarGridHelper
HemisphereLightHelper
PlaneHelper
PointLightHelper
SkeletonHelper
SpotLightHelper
Light
PointLight
RectAreaLight
SpotLight
DirectionalLight
HemisphereLight
LightShadow
PointLightShadow
AnimationLoader
AudioLoader
BufferGeometryLoader
CompressedTextureLoader
CubeTextureLoader
DataTextureLoader
FileLoader
ImageBitmapLoader
ImageLoader
Loader
LoaderUtils
MaterialLoader
ObjectLoader
TextureLoader
LoadingManager
Material
Box2
Box3
Color
Cylindrical
Euler
Frustum
Interpolant
Line3
MathUtils
Matrix3
Matrix4
Plane
Quaternion
AnimationAction
AnimationClip
AnimationMixer
AnimationObjectGroup
AnimationUtils
keyframeTrack
PropertyBinding
PropertyMixer
BooleanKeyframeTrack
QuaternionKeyframeTrack
StringKeyframeTrack
Audio
AudioAnalyser
AudioContext
AudioListener
PositionalAudio

AnimationAction.crossFadeTo()

介绍

AnimationAction.crossFadeTo() 是three.js中的一个方法,允许在两个动画之间进行淡入淡出的过渡。

语法

AnimationAction.crossFadeTo( target: AnimationAction, duration: Number, warp: Boolean )

参数

  • target:需要进行淡入淡出的目标动画。
  • duration:淡入淡出的持续时间,以秒为单位。
  • warp:是否对动画进行时间扭曲。

示例

let mixer = new THREE.AnimationMixer( object );
let action1 = mixer.clipAction( animation1 );
let action2 = mixer.clipAction( animation2 );

// 播放第一个动画
action1.play();

// 进行淡入淡出的过渡
action1.crossFadeTo( action2, 1 );

注意事项

  • 目标动画必须是已经存在的动画,并且需要与当前动画具有相同的骨骼层次结构。
  • 过渡完成后,当前动画将停止播放,而目标动画将开始播放。
  • 如果 warp 参数设置为 true,则动画将根据淡入淡出的速度进行时间扭曲,以保持动画的同步和流畅性。此选项适用于两个动画的长度不同的情况。
  • 必须先通过 mixer.clipAction() 将动画添加到 mixer 中,才能使用 crossFadeTo() 方法。