哈囉!又到了快樂的教學時光。
這次的教學要來用表達式操控時鐘──藉由旋轉角度,完成分針和秒針的表達式關係。
難度:★☆☆☆☆
在這篇教學中,你可以學到:
- 四捨五入表達式。
- 秒單位變化表達式。
- 簡單的數學。
一樣,新開一個專案,
在這個專案中直接新增一個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物件的製作效果,可能下次會再延伸教到
那這次的教學到這結束,我們下次見~