前面讲了Defold支持的动画类型,也详细讲了Defold的逐帧动画,接下来本文讲Defold的补间动画。补间动画很好理解,比如,在让某一个Game Object从位置A移动到位置B,只需要告诉Defold位置A与位置B的值以及缓动函数与动画播放方式就可以完成此动画。
补间动画在Defold中又被称为属性动画,Game Object与各种Component的属性都可以用做补间动画。以Game Object的补间动画为示例。
go.animate(".", "position.x", go.PLAYBACK_ONCE_FORWARD, target_x, go.EASING_LINEAR,
duration, delay, complete_function)
从以上代码可知:
- 第一个参数是要执行动画的game object的url。
- 第二个参数是变化的属性,这个属性只要是数值类型的就可以,当然也包含vector3或vector4这一类的数据类型。本示例中只是变化位置的x坐标值,也可以直接使用position,进行位置的变化。
- 第三个参数表示动画的播放方式,下面列表会详细讲解播放方式。
- 第四个参数表示属性变化的目标值。
- 第五个参数表示指定属性从原值到目标值之间的变化趋势,也就是缓动函数,后面有列表说明。
- 第六个参数表示完成一次补间动画需要的时长,单位为秒。
- 第七个参数表示每次动画开始前延迟多长时间,单位为秒。
- 第八个参数表示动画完成之后回调函数,如果动画被取消或动画插放模式为循环,那么此回调函数不执行。
动画播放方式如下表所示,其实与逐帧动画的播放方式相似。
| 播放方式 | 说明 |
|---|---|
| go.PLAYBACK_ONCE_FORWARD | 从头到尾播放一次 |
| go.PLAYBACK_ONCE_BACKWARD | 从尾到头播放一次 |
| go.PLAYBACK_ONCE_PINGPONG | 从头到尾再从尾到头播放一次 |
| go.PLAYBACK_LOOP_FORWARD | 从头到尾循环播放 |
| go.PLAYBACK_LOOP_BACKWARD | 从尾到头循环播放 |
| go.PLAYBACK_LOOP_PINGPONG | 从头到尾再从尾到头循环播放 |
缓动函数说明示例如下所示:
| 类型 | 模式 | 常量示例 | 运动特点 |
|---|---|---|---|
| 线性 | 匀速 | LINEAR | 无加速/减速 |
| 多项式 | 缓入 | INQUAD→INQUINT | 启动慢,后期加速越猛 |
| 缓出 | OUTQUAD→OUTQUINT | 启动快,结束前减速明显 | |
| 缓入缓出 | INOUTQUAD→INOUTCUBIC | 开头加速 + 结尾减速 | |
| 物理效果 | 回弹 | INBOUNCE/OUTBOUNCE | 模拟物体弹跳 |
| 弹性 | INELASTIC/OUTELASTIC | 橡皮筋拉伸回弹 | |
| 回拉 | INBACK/OUTBACK | 运动前/后轻微过冲再修正 | |
| 数学曲线 | 正弦 | INSINE/OUTSINE | 平滑波浪式运动 |
| 圆形 | INCIRC/OUTCIRC | 圆周轨迹加速/减速 | |
| 指数 | INEXPO/OUTEXPO | 开始/结束近乎静止,中间骤变 | |
| 组合模式 | 缓出+缓入 | OUTINBACK/OUTINBOUNCE | 先加速飞出,再减速停止(带特效) |
关于缓动函数的选择建议如下:
- 物理仿真 使用
BOUNCE(弹跳)、ELASTIC(弹性)、BACK(回拉)三类。 - 自然运动 使用
SINE(正弦)或QUAD(二次方)两类。 - 夸张效果 使用
EXPO(指数)或QUINT(五次方)两类。 - 通用场景 使用
EASING_INOUTQUAD或EASING_INOUTSINE。