这次的教学要来用表达式操控时钟──借由旋转角度,完成分针和秒针的表达式关系。

难度:

在这篇教学中,你可以学到:

  1. 四舍五入表达式。
  2. 秒单位变化表达式。
  3. 简单的数学。

 

 

一样,新开一个专案,

在这个专案中直接新增一个Shape Layer:

 

在Shape内创一个矩形:

 

它创出来的矩形是干净的,没有外框或填色,所以我们手动加一个:

预设是红色,你可以改成你想要的颜色。

 

然后选择Rectangle和Fill,将它们都加入群组:

 

 

新创的矩形会是正方形,我们自己手动调整它的宽和高:

到Path内控制它的Size,将它改细长一点~

 

 

 

加入群组后,就会多了该群组的Transform控制:

 

 

 

要让锚点在这细条的最下边:

可以直接控制锚点座标,记住你所改的高,例如刚才的高我设定成100,那锚点就要往上50(因为锚点正巧在中央处)。

 

 

 

 

这时就可以控制它的旋转囉!

 

 

 

 

这边随便拉了个闹钟的框和时间刻度:

如上图所示,一般要让这个秒针以时钟中央为中心点顺时钟旋转,可以打上表达式time*6,也就是每秒变化6的数值。

逻辑:秒针走一圈(360度)等于走12个数字,每一个数字为360/12=30度;我们的时间单位,一个刻度之间是5秒(5个动作),所以秒针动一次会是30/5=6度。

而每一秒移动6度,即time*6。

 

秒针部分结束后,CTRL+D复制一个,取名为min(分针):

修改一下长短和粗细。

 

一样的方式,打上表达式:

不过这边的表达式是time*6/12,也就是把刚才分针的公式再除以12个数字,就会得到秒针走一圈后、分针走的度数。

 

因为刚才创的COMP只有10秒,所以可以按CTRL+K,更改该Comp的时间长度:

 

改完后又有了个问题:

就是时间拉到最后,并不是60秒进位至1分钟,而是59.27。

原因是帧率:

改为30即可。

在电视上播放才用29.97,一般情况下使用24、30等整数帧率,不需要使用丢格。

这关系到影音同步的问题,这边不多说~

 

另一方面,由于AE的时间会从0帧开始,但我们表达式计算的是从1帧,因此持续时间还要额外多给它1帧:

※AE仅能设定开始帧是要从0开始还是从1开始。

 

因此,原先当我们拉到底,会发现它停在59秒29帧:(没有将持续时间多加1帧的话)

秒针也能看出它稍微偏左了一些。

 

改完后,将时间拉到结尾:

它就能完整的旋转360度成1圈了~

 

成品范例:

 

 

 

假设,我想让秒针是一格一格的移动──就是一秒才动一次的方式,只需做些简单的更动即可。

 

将刚才的分针和秒针CTRL+D复制一个,这边只是单纯想保留刚才的版本:

 

然后修改表达式:

改为Math.floor(time)*6──四舍五入取时间最大整数,每阶段增加6的数值。

 

成品范例:

 

 

 

文字的部分也可以用相同的表达式处理,不过部分有些不同,有机会再说说~

在这边示范绑定E3D物件的制作效果,可能下次会再延伸教到

 

那这次的教学到这结束,我们下次见~