type
status
date
slug
summary
tags
category
icon
password
Edited
Aug 3, 2023 08:18 AM
Created
Aug 3, 2023 07:58 AM
KeyFrameAnimation
所谓关键帧动画，你可以理解为在时间轴上，选择几个关键的时间点，然后分别定义这几个时间点对应物体状态(比如位置、姿态、颜色等)，然后基于几个关键的时间——状态数据，生成连续的动画。
使用步骤
- 模型命名
KeyframeTrack设置关键帧数据
- 创建关键帧动画
AnimationClip
AnimationMixer播放关键帧动画
mixer.update()更新播放器AnimationMixer时间
动画动作对象AnimationAction 属性
- 循环属性
.loop
控制动画是否循环播放
.clampWhenFinished属性
模型停留在关键帧动画结束的状态
.play()
播放
.stop()
停止结束动画
.paused
是否暂停播放
.timeScale
倍速播放
.time
开始播放时间
.duration
播放结束时间
动画停留在任意时间
外部模型
如果一个模型中存在动画，可以通过属性获取
gltf.animationsgltf.animations是一个数组，如果没有帧动画数据，就是一个空数组，有帧动画数据的情况下，里面可能1个或多个Clip动画对象AnimationClip变形动画
.morphAttributes设置几何体变形目标顶点数据
.morphTargetInfluences权重系数控制变形程度
mesh的几何体变形目标是放在一个数组
.morphAttributes.position中的，设置权重系数morphTargetInfluences的时候，需要设置索引值， 比如.morphTargetInfluences[0]影响的变形目标是.morphAttributes.position[0]，.morphTargetInfluences[1]影响的变形目标是.morphAttributes.position[1]使用
Bone
骨骼关节
Bone的作用就是模拟人或动物的关节运动，控制身体表面变形，来生成骨骼动画骨骼关节Bone树结构
人或动物实际的骨骼关节结构往往是比较复杂的，一般可以用一个层级树结构表达。
SkeletonHelper可视化骨骼关节
把所有骨骼关节对象的父对象，也就是根节点骨骼Bone1，添加一个模型对象中作为子对象，然后把模型对象作为
SkeletonHelper的参数，就可以看到骨骼关节的可视化效果。这次的内容都是和动画相关的，如果了解过CSS的话，非常好理解
内容差不多到这里就介绍完了 🎉🎉🎉
参考链接
- 作者:JinSo
- 链接:https://jinso365.top/article/three-keyframeanimation%26bone
- 声明:本文采用 CC BY-NC-SA 4.0 许可协议，转载请注明出处。