《Ae教學-Math》【搞什麼系列】第八章-畢業考試_AE表達式(expression)

Fei

更新於 2024/12/07發佈於 2024/08/05閱讀時間約 9 分鐘

【搞什麼系列】第八章-畢業考試 (Math)

嘿！我是新手村村長 Fei。勇者你來到搞什麼世界也已經一段時間了，現在要給你最後的新手任務畢業考試，請到新手村中央廣場進行魔力小考試，通過的人就可以從新手村畢業囉！

各位村民、勇者大家好！歡迎來到一年一度的新手村畢業考試！我是今天的考官 "藝梨"，本屆有資格參與考試的勇者總共 3 位，如果考試通過將由我們村長 Fei 頒發畢業證書！現在讓我們用熱烈掌聲歡迎村長 Fei 以及 3 位勇者！！！

(鼓掌聲)

請 3 位勇者走到測驗台前，接著要宣布今天考試規則囉！請聽好！

本次測驗規則為：魔力值可以達到 "3" 即可畢業。魔力值初階為 "1"、中階為"2"、高階為"3"，非常簡單吧！

因為勇者們都沒有使用過魔力石，我們請村長 Fei 來跟勇者說明使用方法吧！

1. 新手的主線任務

村長拿出魔力石使用方法給參賽勇者們。

魔力石使用方法如下：
1. 新增 Text (文字圖層)
2. 套用 Slider Control (滑桿控制器)到 Text (文字圖層)上
3. Source Text 連結到 Slider 上
4. 0 秒設定關鍵幀數值 0，3 秒設置數值 3

1. 新增 Text (文字圖層)

套用 Slider Control (滑桿控制器)到 Text (文字圖層)上

3. Source Text 連結到 Slider 上

4. 0 秒設定關鍵幀數值 0，3 秒設置數值 3

結果出現問題！

出現問題

要準確出現整數的話，最基本的有 3 個方法！

點開 Text (文字圖層) 找到 Source Text，找到表達式清單，

找到裡面的 JavaScript Math，會看到一堆咒語，但你要記得最基本的 3 個：

`Math.round()`

`Math.ceil()`

`Math.floor()`

3 位勇者各自選一個咒語，再來就要正式測驗囉！

主持人藝梨：看來 3 位勇者都選擇好了！讓我們來看看！

哇！這次 3 位勇者各自選擇了不同的的咒語

Math.round(value)

Math.ceil(value)

Math.floor(value)

選好後，請在 Source Text 的咒語欄，將 value 選取起來，用迴文連結至 Slider。

Math.round(effect("Slider Control")("Slider"))

Math.ceil(effect("Slider Control")("Slider"))

Math.floor(effect("Slider Control")("Slider"))

3 位勇者都連結好了，讓我們來看看結果吧！

噹噹噹！
恭喜選擇 Math.ceil() 的勇者率先到達 3！
接著是選擇 Math.round() 的勇者！
選擇 Math.floor() 的勇者數值也順利到 3 了！

我們恭喜 3 位勇者都順利畢業！接著讓我們歡迎村長 Fei 來說明原理並頒發畢業證書！

村長：恭喜本次參加的 3 位勇者都順利過關，你們來到這個世界的成長我都看在眼裡，也很高興有這麼努力又有天分的勇者來到這個世界。

這次考試的 3 個咒語分別為：

Math.round() 四捨五入
Math.ceil() 無條件進位
Math.floor() 無條件捨去

Math 的基礎是新手任務的最後一個，你們都成功完成了，恭喜！

恭喜你完成新手的主線任務-畢業考試
_{任務獎勵：}_{【搞什麼世界】新手村畢業證書}
_{(稀有道具。擁有後可以解鎖新區域，並可以到其他城鎮執行更多的任務，能在這個世界暢行無阻！)}

畢業證書上面還貼著 Fei 給你的紙條

Fei 的留言紙條

2. 小進階技巧

基本數學運算

除了前面提到的 3 種基礎運算
Math.round() ：四捨五入。 Math.round(4.7) → 5
Math.floor() ：無條件捨去。 Math.floor(4.9) → 4
Math.ceil() ：無條件進位。 Math.ceil(4.1) → 5
還有 Math.abs() ：返回數值的絕對值。 Math.abs(-5) → 5

Math.min()、Math.max() 最小值與最大值

Math.min(a, b, c...) ：返回最小值。 Math.min(6, 8, 2) → 2
Math.max(a, b, c...) ：返回最大值。 Math.max(6, 8, 2) → 8

Math.pow()、Math.sqrt() 指數與對數

Math.pow(x, y) ：計算 x 的 y 次方。 Math.pow(2, 3) → 8
Math.sqrt(x) ：計算平方根。 Math.sqrt(16) → 4

Math.random() 隨機數

Math.random() ：返回 0 到 1 之間的隨機數（不包含 1）。
Math.random() → 結果會在 0 - 1 之間隨機變化

_{村長的課外課時間}

Math.random() 與 random() 的差別

Math.random() 屬於JavaScript 內建函數。
範圍：0（包含）到 1（不包含）之間的浮點數。
特點：必須進行額外的數學運算來調整範圍或類型（如整數）。
優點：更靈活，可以嵌套在其他數學運算中。

random() 為 Ae 表達式的專用方法。
範圍：默認在 0 到 1 之間，也可以指定最小值和最大值。
特點：比 Math.random，語法更簡潔，可以直接指定範圍。
優點：快速生成特定範圍的隨機值。

同樣要生成 10 到 50 的隨機值

Math.random() → Math.random() * (50 - 10) + 10;

random() → random(10, 50);

大多情況 random() 更方便和直觀。如需更複雜的隨機運算（如分段範圍或特定數學處理），再使用 Math.random() 即可。

三角函數

Math.sin(x) ：角度（以弧度為單位）的正弦值。初始值從 0 開始，範圍為 -1 到 1。Math.cos(x) ：角度的餘弦值。初始值從 1 開始，範圍為 -1 到 1。
Math.tan(x) ：角度的正切值。範圍無限大（但會在某些角度趨近無窮大）。

三角函數

搖晃效果

用 Math.sin 模擬規律的周期性變化。例：模擬波浪
x 軸向固定的波浪：

amplitude = 100;  //搖晃幅度
frequency = 1;   //每秒搖晃次數
x = transform.position[0];  //x 軸 Position 固定
y = transform.position[1] + amplitude * Math.sin(time * frequency * Math.PI * 2); //將時間從秒數轉換為弧度（完整的正弦波需要 2π 弧度）
[x, y];

將上方的 Math.sin 改成用 Math.cos 則會變成反向。雖波形形狀相同，但相位（開始點）與正弦波相差 90°（或 π/2 弧度）。

波浪移動 (三角函數)

Math.PI 圓周率

Math.PI ：圓周率（約等於 3.14159）。

沿圓形運動

radius = 200;  //設定半徑
angle = time * Math.PI;   //每秒旋轉半圈
x = transform.position[0] + radius * Math.cos(angle);
y = transform.position[1] + radius * Math.sin(angle);
[x, y];