SwiftUI Picker样式设置：修改前景色、背景色与字体大小

问题修正与样式实现 #

你遇到的核心问题有两个：一是selectedInterval初始值和选项不匹配，导致选中状态异常；二是macOS默认Picker样式会接管内部Text的样式，直接给Text设置字体无效。以下是修改后的完整代码，包含字体大小、前景色、背景色的自定义设置：

struct ContentView: View {
    private let numberOfIntervals = [
        "1 Interval",
        "2 Intervals",
        "3 Intervals",
        "4 Intervals"
    ]  
    // 修正初始值，与选项数组中的元素匹配
    @State var selectedInterval: String = "1 Interval"

    var body: some View {
        Picker("Choose an Interval", selection: $selectedInterval) {
            ForEach(numberOfIntervals, id: \.self) { interval in
                Text(interval)
                    // 可选：单独设置每个选项的前景色
                    .foregroundColor(.blue)
            }
        }
        // 指定Picker样式，让字体设置能作用到选项上
        .pickerStyle(PopUpButtonPickerStyle())
        // 设置Picker标签和选项的字体大小
        .font(.largeTitle)
        // 设置Picker标签的前景色
        .foregroundColor(.purple)
        // 设置Picker的背景色
        .background(Color.yellow.opacity(0.3))
        // 设置选中选项的高亮颜色
        .tint(.orange)
        .padding()
    }
}

关键说明 #

• PopUpButtonPickerStyle()：macOS上使用该样式时，Picker的字体设置会同步应用到下拉选项中，解决直接给Text设置字体无效的问题。
• tint(_:)：控制选中选项的高亮颜色，区别于未选中选项的foregroundColor。
• 初始值修正：必须保证selectedInterval的初始值存在于选项数组中，否则Picker无法正确显示选中状态。

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