使用@GestureState的动画对象触发控制台错误"Invalid sample AnimatablePair"

错误原因 #

@GestureState是专门用来跟踪手势过程中临时状态的，它的更新完全同步于手势的每一次实时回调，属于高频瞬时的状态变更。当你给依赖这个状态的视图添加.animation(.default, value: isDragging)时，SwiftUI会尝试对布尔值的切换做动画过渡，但手势过程中@GestureState的更新频率和动画系统的时间线不匹配，直接导致了内部动画采样时的时间戳混乱，也就是你看到的那条错误日志。

这是不是正确的实现方式？ #

用@GestureState跟踪拖拽状态本身没问题，但给依赖@GestureState的状态加显式动画是错误的姿势。@GestureState更适合处理拖拽位置这类需要实时更新的临时值，而对于“拖拽开始/结束”这种离散状态的动画，应该用普通的@State或@Binding配合手势的onEnded/onBegan回调来实现，让状态变更和动画系统兼容。

修正方案与替代实现方法 #

方法1：改用@State配合手势回调 #

把@GestureState换成普通@State，通过手势的onChanged和onEnded控制状态变更时机，这样动画就能正常工作：

struct DragDemoView: View {
    @State private var isDragging = false
    @State private var offset = CGSize.zero
    
    var body: some View {
        ZStack {
            // 可拖拽的蓝色大矩形
            Rectangle()
                .frame(width: 300, height: 300)
                .foregroundColor(.blue)
                .offset(offset)
                .gesture(
                    DragGesture()
                        .onChanged { value in
                            offset = value.translation
                            if !isDragging {
                                isDragging = true
                            }
                        }
                        .onEnded { _ in
                            offset = .zero
                            isDragging = false
                        }
                )
            
            // 随拖拽状态变化透明度的红色小矩形
            Rectangle()
                .frame(width: 100, height: 100)
                .foregroundColor(.red)
                .opacity(isDragging ? 1 : 0.3)
                .animation(.default, value: isDragging)
        }
    }
}

方法2：保留@GestureState处理偏移，拆分状态控制拖拽标记 #

如果想继续用@GestureState处理拖拽偏移，可以把isDragging拆成单独的@State，通过手势的onBegan和onEnded更新：

struct DragDemoView: View {
    @GestureState private var dragOffset = CGSize.zero
    @State private var isDragging = false
    
    var body: some View {
        ZStack {
            Rectangle()
                .frame(width: 300, height: 300)
                .foregroundColor(.blue)
                .offset(dragOffset)
                .gesture(
                    DragGesture()
                        .updating($dragOffset) { value, state, _ in
                            state = value.translation
                        }
                        .onBegan { _ in
                            isDragging = true
                        }
                        .onEnded { _ in
                            isDragging = false
                        }
                )
            
            Rectangle()
                .frame(width: 100, height: 100)
                .foregroundColor(.red)
                .opacity(isDragging ? 1 : 0.3)
                .animation(.default, value: isDragging)
        }
    }
}

方法3：用withAnimation实现隐式动画 #

也可以把动画逻辑放在状态变更的地方，用withAnimation包裹状态更新，不需要给视图加显式动画修饰符：

struct DragDemoView: View {
    @GestureState private var dragOffset = CGSize.zero
    @State private var isDragging = false
    
    var body: some View {
        ZStack {
            Rectangle()
                .frame(width: 300, height: 300)
                .foregroundColor(.blue)
                .offset(dragOffset)
                .gesture(
                    DragGesture()
                        .updating($dragOffset) { value, state, _ in
                            state = value.translation
                        }
                        .onBegan { _ in
                            withAnimation {
                                isDragging = true
                            }
                        }
                        .onEnded { _ in
                            withAnimation {
                                isDragging = false
                            }
                        }
                )
            
            Rectangle()
                .frame(width: 100, height: 100)
                .foregroundColor(.red)
                .opacity(isDragging ? 1 : 0.3)
        }
    }
}

以上几种方式都能避免时间戳错误，因为状态变更的时机和动画系统完全同步，不会出现@GestureState高频更新和动画插值的冲突。

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