聊動畫做動畫: AE Expressions教學-4

Interpolation Methods(內插函式): linear(), ease()

前面的教學, 已經知道藉由合併簡單的除法與加法來"手動"調整值的範圍. 我們也可以用同樣的方式轉換360度旋轉特性作用到opacity特性上. 但這不是唯一的方式, 因為AE提供內建的內插函式, 特別設計用來做某個特性中(如opacity)的一組數值的轉換.

linear(t, tMin, tMax, value1, value2)
ease(t, tMin, tMax, value1, value2)
ease_in(...), ease_out(...)

這些函式看起來很複雜, 其實只是參數比較多而已, 這些參數是

t	變數名, 但輸入值必須是1維的值, 例如rotation或time變數
tMin	t的最小值,可以省略.省略時,預設為0.
tMax	t的最大值,可以省略.省略時,預設為1.
value1	此函式輸出的最小值. 當t等於或小於tMin時, 以value1值輸出. value1可以是數字或向量
value2	此函式輸出的最大值. 當t等於或大於tMax時, 以value2值輸出. value2可以是數字或向量

舉個例子
linear(time, 0, 5, 0, 360); //time是comp中的內建變數,秒為單位

根據字面解釋: 當time變數值(時間)從0 ~ 5, 以線性計算出0 ~ 360之間的值. 若將此expression運用在圖層的rotation特性中, 圖層會在0秒~5秒間旋轉360度.

到第5秒停止旋轉

如果使用這行程式, 會在第五秒自動停止旋轉. 與上一個教學所講到的技術最大不同是, 本次程式在第五秒自動停止, 前次的教學是一直執行下去(若要停止,必須在加上程式碼).

一直旋轉

除了linear()之外, 還有ease(), easeIn() 及 easeOut()等內插函式. 使用這些函式來計算出更自然的效果.

linear() : 中間自動產生的內插值, 以線性方式變化.
ease() : 起點與終點變化較緩慢.
easeIn() : 緩慢離開起點.(寫成ease_in 也可)
easeOut() : 緩慢到達終點.(寫成ease_out 也可)

範例檔下載

範例:捲動軸動畫

   這裡將建立一個簡單的捲動軸動畫, 先建立二個圖層, 一個捲動軸(右邊小方塊)圖層(左右兩條垂直線也是圖層,可忽略), 一個文字區塊圖層. 文字圖層的anchor point(軸心)將加入expression (若加在position, position就被封住) ,這樣排版時我們還可移動文字圖層的position, 但position基本是不動, 因為要驅動的是捲動文字圖層的anchor point.

   必須記得, anchor point的值變化與圖層移動是相反的. 在這個例子, 要將文字圖層的anchor point往下移動, 所以文字會往上移動. 為了捲動完所有文字, 必須讓anchor point的y軸數值從0變化到文字區塊的高度值, 所以變數設定成

value1 = 0
value2 = height

   其他變數tMin , tMax , 可以設定為0 及所在comp的高度. 為了外觀好看一點, 可以做些修改, 假設尺寸為 320x240. 我們設定使用範圍從 20 到 220. 所以設定捲動軸的y軸值為

tMin=20
tMax=220

   所以捲動軸的y座標值為linear函式的輸入值. 得到以下程式碼

scrollY = thisCom.layer("Scroll").position[1];
scrolledAmount = linear(scrollY, 20, 220, 0, height); //捲動多大範圍

   最後將這結果scrolledAmount放入座標陣列中, 讓anchor的x軸的值不變, 完整的expression如下.

scrollY=thisComp.layer("Scroll").position[1];
scrolledAmount=linear(scrollY, 20, 220, 0, height);
[anchorPoint[0], scrolledAmount];

   最後的動畫如下, 右邊小方塊是捲動軸 thisComp.layer("Scroll") , 它的y軸值將讓文字區塊移動.

當然上例是需要垂直捲動. 我們也可建立水平捲軸, 用x軸值來驅動. 更可延伸到3D旋轉捲動, 加入expression到 3D圖層的rotation特性中.