2.3_为 withAnimation 指定动画曲线和时长

当然！让我们一起探索如何在 SwiftUI 中为 withAnimation 指定动画曲线和时长，让你的动画更加生动有趣！🎉

定制你的动画体验

withAnimation 代码块是 SwiftUI 中创建显式动画的关键。你可以通过它来控制动画的各个方面，包括动画的曲线和持续时间。这让你能够精确地调整动画效果，以满足你的设计需求。

• 动画曲线: 动画曲线决定了动画的速度变化。SwiftUI 提供了多种内置的动画曲线，例如 .linear（匀速）、.easeIn（加速）、.easeOut（减速）和 .easeInOut（先加速后减速）。你也可以使用 .spring() 创建弹簧动画。
• 动画时长: 动画时长决定了动画的播放时间。你可以使用 duration 参数来指定动画的持续时间，单位为秒。

如何指定动画曲线和时长

要为 withAnimation 指定动画曲线和时长，你可以使用以下方法：

1. 使用 Animation 结构体: 你可以使用 Animation 结构体来创建一个自定义的动画配置，然后将其传递给 withAnimation。

   withAnimation(.easeInOut(duration: 0.5)) {
       // 你的动画代码
   }

   在这个例子中，我们使用了 .easeInOut 动画曲线，并将动画时长设置为 0.5 秒。

2. 使用 animation 修饰符: 你也可以使用 animation 修饰符来为视图添加动画效果。

   .animation(.spring(response: 0.55, dampingFraction: 0.825, blendDuration: 0))

   这个例子展示了如何使用 spring 动画，并指定了 response（响应速度）、dampingFraction（阻尼系数）和 blendDuration（混合时长）等参数。

实例演示

假设你想要创建一个按钮，当点击时，按钮的背景颜色会平滑地改变。你可以使用 withAnimation 来实现这个效果：

struct ContentView: View {
    @State private var isToggled = false

    var body: some View {
        Button("Toggle") {
            withAnimation(.easeInOut(duration: 0.5)) {
                isToggled.toggle()
            }
        }
        .background(isToggled ? Color.red : Color.blue)
        .foregroundColor(.white)
        .padding()
    }
}

在这个例子中，当 isToggled 的值改变时，按钮的背景颜色会以 0.5 秒的 easeInOut 动画曲线进行过渡。是不是很简单呢？🥳

通过灵活运用动画曲线和时长，你可以创建出各种各样令人惊艳的动画效果，为你的 SwiftUI 应用增添更多活力！🚀