30天学会Swift-24：SwiftUI-动画与过渡

学习目标

• 理解SwiftUI中动画的基本概念和工作原理
• 掌握使用.animation()修饰符创建隐式动画
• 掌握使用withAnimation函数创建显式动画
• 学习使用transition创建视图过渡效果
• 了解组合动画和自定义动画曲线

学习内容

1. SwiftUI动画基础

SwiftUI中的动画是通过声明式的方式实现的。当视图的状态发生变化时，SwiftUI会自动计算中间状态并平滑过渡。

2. 隐式动画

使用.animation()修饰符可以创建隐式动画。当修饰符绑定的值发生变化时，视图会自动产生动画效果。

2.1 基本用法

struct ImplicitAnimationView: View {
   
   
    @State private var scale: CGFloat = 1.0
    
    var body: some View {
   
   
        Button("Tap Me") {
   
   
            scale += 0.5
        }
        .scaleEffect(scale)
        .animation(.default, value: scale) // 当scale变化时应用动画
    }
}

2.2 动画类型

SwiftUI提供了多种预定义的动画曲线：

• .default - 默认动画
• .easeIn - 开始慢，然后加速
• .easeOut - 开始快，然后减速
• .easeInOut - 开始和结束慢，中间快
• .linear - 匀速
• .spring() - 弹簧效果

3. 显式动画

使用withAnimation函数可以创建显式动画，它允许你精确控制哪些状态变化应该产生动画。

struct ExplicitAnimationView: View {
   
   
    @State private var angle: Double = 0
    @State private var isRotating = false<