SwiftUI中Picker控制TabView切换无动画问题求助

当使用分段Picker控制TabView选中项时，点击Picker切换标签没有页面过渡动画，但滑动TabView时Picker能正常伴随动画更新——这是因为直接修改绑定值不会触发TabView的页面切换动画，而滑动操作属于TabView原生逻辑，自带动画联动。

解决方案：手动为状态更新添加动画 #

通过自定义绑定，在Picker选中状态变化时用withAnimation包裹状态更新，让TabView的切换跟随动画执行。

修改后的代码如下：

struct ContentView: View {
    @State var tabSelectedValue = 0

    var body: some View {
        VStack {
            // 自定义绑定，设置值时触发动画
            Picker("", selection: Binding(
                get: { tabSelectedValue },
                set: { withAnimation { tabSelectedValue = $0 } }
            )) {
                Text("First").tag(0)
                Text("Second").tag(1)
            }
            .pickerStyle(SegmentedPickerStyle())
            .padding()
            
            TabView(selection: $tabSelectedValue) {
                Text("Content for first tab")
                    .tag(0)
                Text("Content for second tab")
                    .tag(1)
            }
            .tabViewStyle(.page(indexDisplayMode: .never))
        }
        .padding()
    }
}

简化写法 #

也可以直接给Picker添加animation修饰符，让状态变化带动画：

Picker("", selection: $tabSelectedValue) {
    Text("First").tag(0)
    Text("Second").tag(1)
}
.pickerStyle(SegmentedPickerStyle())
.padding()
.animation(.default, value: tabSelectedValue) // 添加动画修饰符

两种方法都能实现点击Picker时TabView内容平滑切换的效果，同时保持滑动TabView时Picker的动画同步。

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