如何在SwiftUI中实现偏移量0→30→-30→0的视图抖动效果

Bool类型只有真、假两个状态，最多只能对应两个偏移值，根本没法覆盖0.0、30.0、-30.0三个节点的多段动画逻辑，自然做不出预期的三段式抖动效果。

把存储状态的布尔值换成可以承载连续数值的CGFloat类型，直接把偏移量作为动画的依赖值，点击触发时按预设路径逐段更新偏移值即可，完整代码如下：

struct ContentView: View {
    @State private var offsetX: CGFloat = 0.0 // 初始状态偏移为0
    var body: some View {
        Image(systemName: "exclamationmark.triangle")
            .font(Font.system(size: 50))
            .offset(x: offsetX)
            .padding()
            .animation(Animation.spring(response: 0.2, dampingFraction: 0.2, blendDuration: 0.2), value: offsetX)
        
        Button("Shake") {
            // 第一步：从0移动到30
            offsetX = 30.0
            // 等第一段动画跑完，移动到-30
            DispatchQueue.main.asyncAfter(deadline: .now() + 0.2) {
                offsetX = -30.0
                // 等第二段动画跑完，回归初始0位置
                DispatchQueue.main.asyncAfter(deadline: .now() + 0.2) {
                    offsetX = 0.0
                }
            }
        }
    }
}

• 代码里单段动画的response参数设为0.2，所以逐段触发的延迟也设为0.2秒，刚好在上一段动画抵达目标节点后启动下一段，不会出现动画衔接错乱
• 如果要调整抖动幅度、动画手感，直接修改偏移数值、弹簧动画参数、分段延迟时长即可
• 全程使用SwiftUI原生动画能力，不需要引入额外依赖，动画路径完全符合0.0→30.0→-30.0→0.0的预期。

内容的提问来源于stack exchange，提问作者swiftPunk