SwiftUI Animation 動畫效果

SwiftUI 讓製作流暢動畫變得前所未有的簡單。你不需要處理複雜的座標運算，只需要告訴 SwiftUI 「起始狀態」和「結束狀態」，它就會自動補間產生動畫。

隱式動畫 (Implicit Animation)

最簡單的方式是使用 .animation 修飾符。當綁定的數值改變時，View 的變化就會自動帶有動畫效果。

struct ContentView: View {
    @State private var scale = 1.0
    
    var body: some View {
        Button("縮放") {
            scale += 1
        }
        .scaleEffect(scale) // 綁定縮放比例
        .animation(.default, value: scale) // 當 scale 改變時，自動執行動畫
    }
}

顯式動畫 (Explicit Animation)

如果你只希望「這次修改」帶有動畫，可以使用 withAnimation 閉包。

Button("旋轉") {
    withAnimation(.spring()) { // 指定使用彈簧動畫效果
        rotation += 90
    }
}

轉場效果 (Transition)

當一個 View 出現或消失時，我們可以定義它的進場/退場方式。

if showDetails {
    Text("詳細資訊")
        .transition(.slide) // 滑動進場
        // 也可以組合: .transition(.opacity.combined(with: .scale))
}

MatchedGeometryEffect (神奇移動)

這是 SwiftUI 最酷炫的效果之一，讓兩個完全不同的 View 在切換時，看起來像是同一個元素飛過去。常用於 Hero Animation (Hero 轉場)。

@Namespace var animation // 定義動畫命名空間

// 視圖 A
Image("avatar")
    .matchedGeometryEffect(id: "avatar", in: animation)

// 視圖 B (在別的地方)
Image("avatar")
    .matchedGeometryEffect(id: "avatar", in: animation)

掌握動畫能大幅提升 App 的質感，讓使用者體驗更加愉悅。