WPF 動畫基礎：聲明式動畫、可動畫屬性條件、內嵌屬性動畫技巧

動畫本質：一段時間改變屬性值

WPF 動畫 = 聲明「想要什麼」，系統負責實現。核心限制：只能改變現有屬性值，無法增減視覺樹節點、無法在兩種佈局間自動插值（如 Horizontal→Vertical StackPanel）。

設計動畫時：問自己「中間狀態長什麼樣？哪個屬性能捕捉該狀態？」。若無法用單一屬性表達中間態，動畫系統也無能為力（改用 Canvas 手動動畫位置大小）。

最簡單範例：橢圓寬度動畫

<Window.Storyboards>
    <SetterTimeline TargetName="myEllipse" Path="(Ellipse.Width)">
        <DoubleAnimation From="10" To="300" Duration="0:0:5" RepeatBehavior="Forever" />
    </SetterTimeline>
</Window.Storyboards>
<Ellipse x:Name="myEllipse" Fill="Red" Height="100" />

• SetterTimeline：TargetName 對應 x:Name，Path 指定目標屬性（含定義類名，如 (Ellipse.Width)）。
• DoubleAnimation：目標屬性為 double 型別；其他型別用對應動畫類別（ColorAnimation 等）。
• From/To/Duration：5 秒內 10→300 線性插值。
• RepeatBehavior="Forever"：無限往返。

可動畫屬性的三個必要條件

1. 必須是相依性屬性：動畫系統依賴 DP 自動更新值。
2. 型別需有對應動畫類別：WPF 內建大多數視覺相關型別（Double、Color、Point、Size...），列舉型別除外（如 Orientation 無中間值）。
3. 目標元素必須繼承 FrameworkElement：視覺樹節點才有動畫支援。

動畫非 FrameworkElement 內嵌屬性：Path 深入導航

例：動畫 Ellipse.Fill (SolidColorBrush) 的 Color 屬性。Brush 非 FrameworkElement，無法直接當目標。解法：

<SetterTimeline TargetName="myEllipse" Path="(Ellipse.Fill).(SolidColorBrush.Color)">
    <ColorAnimation From="Red" To="Purple" Duration="0:0:7" RepeatBehavior="Forever" AutoReverse="True" />
</SetterTimeline>

• TargetName 仍指向 FrameworkElement (Ellipse)。
• Path 用括號語法深入：(父屬性).(嵌套型別.屬性)。
• 同理適用於 Geometry、3D 基礎型別（透過 Path.Data、Viewport3D 等）。

動畫類型總表（表 8-1）

BooleanAnimation、ByteAnimation、CharAnimation、ColorAnimation、DecimalAnimation、DoubleAnimation、Int16/32/64Animation、MatrixAnimation、Point/Point3DAnimation、Rect/Rect3DAnimation、Rotation3DAnimation、SingleAnimation、Size/Size3DAnimation、StringAnimation、ThicknessAnimation、Vector/Vector3DAnimation。

• 皆提供 From/To，多數支援 By（相對當前值增量）。
• AccelerationRatio/DecelerationRatio 提供緩入緩出（0~1 代表持久比例）。

多動畫協調：Storyboard 存在的理由

單一屬性單一動畫可簡單聲明；但同時動畫多屬性、多元素、需異步協調時，Storyboard 隔離動畫結構與 UI 結構，提供統一時間基準與觸發機制。