SwiftUI中如何模拟原生分段选择器的嵌入样式与选中按钮3D效果？

我完全懂你的需求——原生分段选择器的嵌入内凹背景和选中项的精致3D质感确实很加分，而且原生Picker没法给每个选项加单独的tooltip，所以自定义控件是必须的。我来帮你调整代码，尽量贴近原生的视觉效果，同时保留你需要的独立tooltip功能。

先解决嵌入背景的问题 #

原生Segmented Picker的背景并不是用.thickMaterial，而是系统自带的嵌入分组背景色，配合细微的边框来实现内凹效果。我们可以用系统的颜色和Capsule形状来模拟：

• 外层HStack用.tertiary颜色作为背景（这是原生嵌入控件的标准背景色），配合Capsule形状
• 再叠加一层Capsule的边框，颜色用.quaternary，和原生的边框质感一致

然后是选中按钮的3D效果 #

原生选中项的3D感来自于细微的阴影组合：右下的深色阴影和左上的浅色阴影，模拟出内凹/浮雕的视觉效果。我们可以给选中的按钮添加双层阴影，再配合半透明的背景，就能还原这个效果。

修改后的完整代码 #

HStack(spacing: 8) { // 调整间距，贴近原生Picker的选项间距
    ForEach(ToolType.allCases, id: \.self) { toolType in
        Button {
            toolManager.tool = toolType
        } label: {
            Image(systemName: toolType.iconName())
                .frame(width: 44, height: 36)
                .tint(toolType == toolManager.tool ? .white : .gray)
        }
        .tag(toolType)
        .help(toolType.name()) // 保留独立tooltip
        // 选中按钮的样式
        .background(
            toolType == toolManager.tool ? 
                Capsule()
                    .fill(.thinMaterial) // 半透明背景，贴近原生选中项
                    // 双层阴影实现3D质感
                    .shadow(color: .black.opacity(0.15), radius: 2, x: 1, y: 1)
                    .shadow(color: .white.opacity(0.8), radius: 2, x: -1, y: -1)
                : Color.clear
        )
        // 未选中按钮的细微边框，增强区分度
        .overlay(
            toolType != toolManager.tool ? 
                Capsule().stroke(.quaternary.opacity(0.5), lineWidth: 0.5)
                : nil
        )
    }
}
.frame(height: 44)
.padding(.horizontal, 4) // 给外层背景加一点内边距，更贴合原生
.background(.tertiary, in: Capsule()) // 原生嵌入背景色
.overlay(Capsule().stroke(.quaternary, lineWidth: 1)) // 原生边框

效果说明 #

1. 外层背景：和原生Segmented Picker的嵌入内凹效果几乎一致，用系统颜色保证在不同外观模式（亮色/暗色）下都能正确适配
2. 选中按钮：双层阴影模拟出3D浮雕感，半透明背景和原生选中项的质感匹配
3. 未选中按钮：细微的边框让选项之间的区分度更清晰，贴近原生的视觉逻辑
4. 保留了每个按钮独立的.help tooltip，满足你的核心需求

这样调整后，你的自定义控件应该就能和原生Picker的视觉效果非常接近，同时还能实现原生做不到的独立tooltip功能啦！

备注：内容来源于stack exchange，提问作者Runt8