
第3节 时间表达式
在和时间有关的表达式函数中,常用的主要有“time”和“valueAtTime”函数。
知识点1 “time”函数
“time”函数提取的就是合成当前的时间(秒),通常合成的时间数值相对较小,所以在实际运用中经常使用“time*n”的形式,也就是时间的n倍。“time”函数主要用来为属性提供持续变化的数值。
案例1 钟表动画
在合成中用形状图层创建钟表表盘、刻度,以及表盘上的时针和分针,如图1-15所示。

图1-15
在分针的旋转属性中添加表达式,输入“time*100”使得分针持续转动,如图1-16所示。

图1-16
在时针的旋转属性中添加表达式,并将时针的旋转属性通过表达式关联器链接到分针的旋转属性上。在表达式框中的表达式语句后输入“/12”,使时针的旋转速度是分针旋转速度的1/12,效果如图1-17所示。

图1-17
知识点2 “valueAtTime”函数
“valueAtTime”函数是延迟表达式,主要用于实现错帧动画效果。
为需要制作延迟动画的属性添加表达式时,可在“表达式语言”下拉菜单中执行“Property-valueAtTime(t)”命令,如图1-18所示。表达式语句结构如图1-19所示。

图1-18

图1-19
案例2 钟摆动画
绘制一个摆锤形状,将图层重命名为“钟摆”,将“钟摆”图层的中心点上移至图层顶部。调节其旋转属性并添加关键帧,制作摆锤左右摆动的动画。选中所有关键帧,按快捷键F9使动画缓动,效果如图1-20所示。

图1-20
选中“钟摆”图层,按快捷键Ctrl+D进行复制,在复制得到的图层中选中旋转属性,为其添加表达式,并在“表达式语言”下拉菜单中执行“Property-valueAtTime(t)”命令。在表达式框中将语句改写为“valueAtTime(time-0.1)”,如图1-21所示。

图1-21
该图层的旋转属性值会自动取0.1秒之前的数值,从而完成错帧的效果,如图1-22所示。

图1-22
选中“钟摆”图层,按快捷键Ctrl+D 3次,在得到的每个图层的旋转属性表达式的语句“valueAtTime(time-0.1)”中,将“()”中的内容依次修改为“time-0.2”“time-0.3”“time-0.4”,制作出连续错帧的动画效果,如图1-23所示。

图1-23
完成钟摆动画错帧后,产生了非常有韵律感的摆动动画,最终效果如图1-24所示。

图1-24