插值(缓动)(Interpolation (Easing))
当您在某个属性上设置两个关键帧时,这两个关键帧之间的值会自动计算,这就叫做插值(Interpolation)。通过调整插值设置,您可以得到截然不同的动画节奏和观感。
您可以通过以下两种方式设置关键帧缓动:
- 时间轴右侧的插值面板(Interpolation Panel)
- 图表编辑器(Graph Editor)(可通过时间轴附近的快捷按钮切换)
使用插值面板(Using the Interpolation Panel)
当您在时间轴中选中任意数量的关键帧时,插值面板会显示在时间轴右侧。
插值图会可视化展示:从当前所选关键帧到下一个关键帧之间,属性值如何随时间变化。横轴(x)表示时间,纵轴(y)表示属性值变化。
您可以通过图表上方的图标切换插值类型。
线性(Linear)
线性是默认插值类型,会以恒定速率从当前关键帧值过渡到下一个关键帧值。
三次曲线(Cubic)
三次曲线插值会使用一条曲线在关键帧值之间过渡,并提供两个可拖拽手柄来调整曲线形状。
您可以在 y 轴方向自由拖动手柄。若拖出图表边界,图表视图会自动调整,保证手柄始终可见。
默认三次曲线通常会在开头和结尾变化较慢,中间变化更快。
保持(Hold)
保持不会在关键帧之间插值,它会一直维持当前值,直到到达下一个关键帧时瞬间切换。
插值字段(Interpolation Field)
预览图下方有一个文本字段,用数值形式表示当前插值。共四个值(通常在 0 到 1 之间),分别表示两侧曲线手柄位置。
如果您需要精确输入品牌规范中的缓动值,可直接在这里输入。这个字段也方便在文件和工具之间复制粘贴缓动参数。
手动输入时,可使用逗号或空格分隔四个值。
图表编辑器(The Graph Editor)
Rive 的图表编辑器用于可视化对象属性随时间变化的趋势,帮助您更直观地控制变化速率与数值本身。
启用图表编辑器(Enabling the Graph Editor)
点击时间轴上的图表编辑器按钮,即可启用图表编辑器。启用后图表编辑器会替代时间轴区域。
注意:只有当前选中的对象才会显示在图表编辑器中。
使用图表编辑器(Using the Graph Editor)
图表编辑器会显示当前插值曲线。您有两种方式在图表中编辑插值:
使用三次曲线插值(Using Cubic Interpolation)
如果您在插值面板中使用的是“三次曲线插值”,仍需在插值面板中调整曲线。
使用三次曲线值(Using Cubic Value)
在插值面板中选择“三次曲线值”后,您可以直接在图表上调整插值。与普通三次曲线插值不同,三次曲线值可以直接影响动画属性的实际数值。