如果學習過《一步一步學習使用FireMonkey動畫》系列的前幾課，可以看到不止一次的使用了動畫的Interpolation屬性指定插值。

插值（Interpolation），在數學和計算機圖形學中，是一種在兩個已知值之間估算中間值的方法。簡單來説，就是給定一個起點 A 和一個終點 B，插值能計算出從 A 到 B 的平滑過渡中的所有“中間點”。

一個生活中的例子：
假設你想從房間的左邊（位置 X=0）走到右邊（位置 X=100）。

起點 A: X = 0
終點 B: X = 100
時間： 10 秒

如果你不是瞬間移動過去的，那麼在第 1 秒、第 2 秒... 第 9 秒時，你會在某個中間位置。計算這些中間位置的過程就是插值。最簡單的插值是線性插值，即勻速運動：

第 1 秒：X = 10
第 2 秒：X = 20
...
第 5 秒：X = 50
第 10 秒：X = 100

這是讓動畫效果豐富多彩的關鍵。

FireMonkey 提供了多種插值函數，它們決定了數值變化的“緩動”效果（Easing）。

• Linear（線性）： 最簡單的插值，勻速變化。
  計算公式：Value = Start + (End - Start) * (CurrentTime / Duration)

• Quadratic（二次方）： 緩慢開始，然後加速（Ease In）；或快速開始，然後減速（Ease Out）。

• Cubic（三次方）、Quartic（四次方）、Quintic（五次方）： 與二次方類似，但效果更強烈。

• Sinusoidal（正弦曲線）： 創建一個類似正弦波的平滑加速和減速。

• Exponential（指數）： 以指數方式變化，產生非常強烈的加速或減速效果。

• Elastic（彈性）： 在終點附近會有“回彈”效果，像一根橡皮筋。

• Bounce（彈跳）： 在終點處像球落地一樣彈跳幾下。

• Back（回拉）： 在開始運動前會先稍微向後（反向）運動一點。

這些類型通常都有 In, Out, InOut 三種模式，分別控制效果應用於動畫的開始、結束還是整個過程。這也是為動畫的AnimationType屬性指定的三種值的作用。

動畫圖解11種線性插值

説實話很難通過語言來介紹這種插值的效果，只有通過動畫才能加深印象，這裏使用了《Delphi GUI Programming with FireMonkey》中的一個Playground示例程序，來一步一步的演示每一種插值類型。

1. Linear（線性插值）

• 描述：最簡單、最基礎的插值類型。數值在設定的持續時間內以恆定速率從起始值變化到結束值。它產生一種機械、均勻的動畫效果，缺乏自然感。

• 數學曲線：一條直的斜線。

• 適用場景：需要穩定、可預測移動的場合，如進度條填充、簡單的滑塊移動、數值的勻速計數等。不適合需要表現真實物理感的效果。

2. Quadratic（二次插值）

• 描述：基於二次方函數 (t²) 的插值。它提供了明顯的加速或減速效果，比線性動畫看起來更自然。

• In 模式：緩慢開始，然後加速到終點。

• Out 模式：快速開始，然後減速到終點。

• InOut 模式：結合兩者，緩慢開始，中間加速，最後減速。

• 數學曲線：拋物線。

• 適用場景：非常通用，適用於大多數 UI 元素的入場和退場動畫。例如，按鈕點擊、菜單滑入滑出、卡片彈出等。

3. Cubic（三次插值）

• 描述：基於三次方函數 (t³) 的插值。其加速/減速的效果比 Quadratic 更強烈、更平滑。變化在開始和結束時更加細微，中間部分變化更快。

• 數學曲線：比二次更陡峭的“S”形曲線。

• 適用場景：當你希望動畫比 Quadratic 更有“力度”和“流暢感”時。是許多現代 UI 設計中默認的緩動效果之一。

4. Quartic（四次插值）

• 描述：基於四次方函數 (t⁴) 的插值。其效果比 Cubic 更進一步，起始和結束時的停頓感更明顯，中間的加速過程非常迅猛。

• 數學曲線：非常陡峭的“S”形曲線。

• 適用場景：需要表現極強動力或快速爆發力的動畫，但使用相對較少，因為可能顯得過於突兀。

5. Quintic（五次插值）

• 描述：基於五次方函數 (t⁵) 的插值。這是“冪函數”插值家族（Quadratic, Cubic, Quartic, Quintic）中最強力的一種。它在開始和結束時幾乎完全靜止，中間有極其短暫的劇烈變化。

• 數學曲線：最陡峭的“S”形曲線。

• 適用場景：創造戲劇性的、能量積聚後瞬間釋放的效果。在日常 UI 交互中很少使用。

6. Sinusoidal（正弦插值）

• 描述：基於正弦函數 (sin) 的插值。它提供了一種非常平滑、柔和的加速和減速效果，沒有冪函數那種強烈的衝擊感。

• 數學曲線：正弦波的四分之一週期，平滑的曲線。

• 適用場景：適合需要優雅、平滑過渡的場景，如淡入淡出、柔和的光效變化、緩慢的頁面切換。

7. Exponential（指數插值）

• 描述：基於指數函數 (2^(10(t-1))) 的插值。它創造出一種非常急劇的加速或減速效果，彷彿變化是瞬間發生或結束的。

• 數學曲線：陡峭的、類似爆炸形的曲線。

• 適用場景：模擬爆炸、能量脈衝、閃電等瞬間高能效果。或者用於需要極度強調的動畫，吸引用户全部注意力。

8. Circular（圓形插值）

• 描述：基於圓形函數 (sqrt(1-t²)) 的插值。它產生一種獨特的慢入快出或快入慢出效果，其運動軌跡類似於四分之一圓弧。

• In 模式：慢入快出，像從弧線頂端滑落。

• Out 模式：快入慢出，像沿着弧線向上滾動到停止。

• 數學曲線：圓形弧線。

• 適用場景：創造一種有趣、俏皮的動畫風格，常見於一些遊戲 UI 或希望展現輕鬆活潑氛圍的應用中。

9. Elastic（彈性插值）

• 描述：模擬彈簧振盪效果的插值。動畫值會超過結束值（Overshoot），然後來回振盪幾次，最終穩定在結束值。可以調整振盪的幅度和次數。

• 數學曲線：衰減的正弦波。

• 適用場景：為UI元素添加活力和彈性反饋。非常適合按鈕、彈窗、通知等交互元素，讓界面感覺更生動、響應更自然。

10. Back（回拉插值）

• 描述：在動畫開始向目標移動之前，會先向相反方向（回拉）稍微移動一點，然後再衝向目標。同樣，在結束時也可能有輕微的過沖。

• 數學曲線：一條先反向再正向的曲線。

• 適用場景：模擬蓄力動作，比如拉弓射箭、準備起跳。讓動畫更有張力，提示用户一個動作即將發生。

11. Bounce（彈跳插值）

• 描述：模擬小球落地彈跳效果的插值。動畫值到達結束點時不會立即停止，而是像球一樣彈跳幾次，幅度逐漸衰減，最終停止。

• 數學曲線：一系列衰減的拋物線。

• 適用場景：表現歡快、有趣的完成狀態。非常適合慶祝性提示、遊戲得分、任務完成等場景，能給用户帶來積極的反饋和愉悦感。

總結與選擇建議