SwiftUI自定义Dock选择器选中时无法切换视图解决方案

视图切换不生效的核心原因是选中状态双层隔离：

• 外层MathematicallyController维护了自己的selection状态，专门用来控制视图切换
• 内层自定义Picker组件单独定义了独立的@State类型selection，点击Dock项时只会修改Picker内部的这个私有状态，外层完全拿不到选中值的变化，自然不会触发视图刷新。
  你写的Picker(selection: selection)调用完全无效，因为自定义Picker没有实现接收绑定值的构造方法，传入的参数根本没有被使用。

1. 改造自定义Picker组件，删除内部独立的选中状态，改为接收外部传入的双向绑定值
2. 外层调用Picker时传入绑定值，打通父子组件的状态同步链路
3. （可选）修正分段选择器的高亮偏移计算逻辑，避免选中高亮位置错位

1. 修改自定义Picker组件 #

struct Picker: View {
    // 删除原有内部@State var selection: Int = 1，改为接收外部绑定
    @Binding var selection: Int
    private let items: [Image] = [
        Image(systemName: "rectangle.on.rectangle"),
        Image(systemName: "timelapse"),
        Image(systemName: "plus")
    ]

    var body: some View {
        SegmentedPicker(items: self.items, selection: self.$selection)
            .padding()
    }
}

2. 修改外层MathematicallyController的Picker调用 #

// 原有错误写法：Picker(selection: selection)
// 修正为传入$开头的双向绑定值
Picker(selection: $selection)
    .padding(5)

3. （可选）修正高亮偏移计算 #

替换SegmentedPicker中的偏移计算方法，解决高亮块位置不准的问题：

private func computeActiveSegmentHorizontalOffset() -> CGFloat {
    CGFloat(self.selection) * (self.segmentSize.width + SegmentedPicker.SegmentXPadding)
}

改完之后，点击Dock项时选中值会同步更新到外层控制器，你写的if-else或者switch视图切换逻辑都可以正常触发。
如果偏好switch写法，视图部分可以直接替换为：

ZStack {
    switch selection {
    case 0:
        // 替换为你的第一个视图
        Color.red
    case 1:
        // 替换为你的第二个视图
        Color.green
    case 2:
        // 替换为你的第三个视图
        Color.blue
    default:
        // 默认兜底视图
        Color.gray
    }
}

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