通过加/减速功能,您可以更改动画转换过程的加速和减速情况。Google Web Designer 为您提供了 CSS3 规范中定义的 5 种标准加/减速选项功能,并且在高级模式下提供了跳转转换和一个自定义加/减速选项。
注意:为文字效果提供了不同的加/减速选项。
“快速”模式下的加/减速选项
在“快速”模式下,缩略图之间的所有动画元素会应用相同的加/减速选项。
如果您在高级模式下修改了加/减速选项,那么当您切换到“快速”模式后,您可能会发现加/减速类型显示为“混合”。
如需在“快速”模式下更改加/减速选项,请执行以下操作:
- 点击缩略图之间的关键帧选项按钮 。
- 此时,系统会打开转换编辑器。
-
在转换编辑器中,点击箭头以循环切换默认加/减速预设。您也可输入秒数,或点击时间字段并左右拖动,来更改加/减速持续时长。
默认加/减速预设
加/减速预设 | 说明 |
---|---|
线性 |
动画匀速变化。 |
中速渐慢 |
动画开始时速度适中,然后一直减速至结束。 |
由快渐慢 |
动画开始时速度很快,然后一直减速至结束。 |
由慢渐快 |
动画开始时速度很慢,然后快速结束。 |
先加速后减速 |
动画开始时和结束时速度都很慢,但在中间阶段速度很快。 |
跳至结束位置 |
动画在加/减速时间段内一直保持在开始位置,然后直接跳到结束位置。 |
保持开始位置 |
动画直接跳到结束位置。 |
高级模式下的加/减速选项
高级模式为您提供了更多加/减速选项:
如需在高级模式下更改加/减速选项,请执行以下操作:
-
右键点击相应的动画跨度(您想为其修改加/减速选项)。要同时修改多个加/减速选项,请先选择相应跨度(如果是连续跨度,请在按住 Shift 键的同时点击要选择的跨度;如果是不连续的跨度,请在按住 Ctrl 键 (Windows) 或 Command 键 (Mac) 的同时点击要选择的跨度),然后右键点击所选的任一跨度。(仅当跨度中包含动画时,其加/减速选项才会更改。)
- 从弹出式菜单中选择一个加/减速预设,或选择加/减速选项…,以查看加/减速曲线的图示或指定自定义加/减速选项。
要创建自定义加/减速选项,请执行以下操作:
- 右键点击相应跨度,然后选择加/减速选项…,以打开“加/减速”对话框。
- 使用下述方法之一更改加/减速选项:
- 拖动控制手柄,以调整加/减速曲线的形状。控制手柄的角度决定了弯曲量,控制手柄的长度决定了加速或减速的强度。
- 在三次贝塞尔曲线字段中,输入您所需的贝塞尔曲线的
cubic-bezier()
函数记号。如果您输入的值无效,该字段会显示红色下划线。
- (可选)点击另存为新的预设值,将此自定义加/减速选项另存为预设。
- 点击应用,将此自定义加/减速选项用于所选的一个或多个跨度。
自定义加/减速预设
如果您想将某个特定的自定义加/减速选项重新应用到多个跨度,请将它另存为预设。预设具有以下优势:
- 快速访问。当您右键点击任一跨度时,即会看到加/减速预设被作为选项列在弹出式菜单中。
- 易于识别。在“高级”模式下,预设名称会显示在时间轴中。
自定义预设会保存在您个人的 Google Web Designer 实例中,并可用于不同的文档。如果您打开的文档包含其他用户的自定义预设,此预设将会显示为“自定义”,而不会使用预设名称。加/减速曲线本身将会保持不变。
要保存新的自定义预设,请在“加/减速选项”对话框中创建自定义加/减速选项,然后点击另存为新的预设值为它命名。预设名称和三次贝塞尔曲线必须是独一无二的。如果任何现有跨度具有相同的自定义值,它们现在都将会显示自定义预设名称。
如需重命名自定义预设,请双击它,或在“加/减速选项”对话框中将鼠标悬停在其上,然后点击预设名称旁边的铅笔图标。修改名称,然后按 Enter 键。现在,任何使用此预设的跨度都将会显示新名称。
如需删除自定义预设,请在“加/减速选项”对话框中将鼠标悬停在其上,然后点击预设名称旁边的垃圾桶图标。对于任何使用此预设的跨度,其加/减速曲线将会保持不变,但它们的加/减速选项现在将会显示为“自定义”。
您无法修改现有预设的曲线。不过,您可以创建新的自定义预设,然后将它应用到您想更改的一个或多个跨度。