是否可以仅覆盖表单的暗模式？

Question

我想要实现的是具有不同背景颜色的表单。但我希望里面的项目始终使用浅色模式变体（深色文本颜色）。但不是完整的视图。我已经搜索过，但找不到任何解决方案。

我尝试listRowBackground 更改有效项目的背景，preferredColorScheme 使用灯光模式，但这将使完整视图处于灯光模式：

...

Form {

    DatePicker(selection: $date, displayedComponents: .date) { ... }
        .listRowBackground(Color.yellow)

    TextField("Name", text: $name)
        .listRowBackground(Color.yellow)

    Picker("amount", selection: $amount) {
        ForEach(amounts, id: \.self) {
            Text($0)
        }
    }
    .listRowBackground(Color.yellow)

    Button(action: { ... }) {
        Label("More", systemImage: "chevron.up")
    }
    .listRowBackground(Color.yellow)

}
.preferredColorScheme(.light)

...

Answer 1

您可以使用.environment 来强制视图的配色方案：

.environment(\.colorScheme, .light)

如果您不想对整个表单执行此操作，则可以仅将其注入嵌套视图：

Form {
    Group {
        DatePicker(selection: $date, displayedComponents: .date) { ... }
            .listRowBackground(Color.yellow)

        TextField("Name", text: $name)
            .listRowBackground(Color.yellow)

        Picker("amount", selection: $amount) {
            ForEach(amounts, id: \.self) {
                Text($0)
            }
        }
        .listRowBackground(Color.yellow)

        Button(action: { ... }) {
            Label("More", systemImage: "chevron.up")
        }
        .listRowBackground(Color.yellow)
    }
    .environment(\.colorScheme, .light)
}

（或仅针对单个视图）

Form {
    // ...

    TextField("Name", text: $name)
        .listRowBackground(Color.yellow)
        .environment(\.colorScheme, .light)

    // ...
}

Answer 2

您可以使用foregroundColor(Color.black) 或accentColor(Color.black) 进行这项工作：

---

import SwiftUI

struct ContentView: View {
    
    @State private var string: String = String()
    
    @State var selectedColor: Int = 2
    let colorArray: [String] = ["Black", "Blue", "Gray", "Green"]

    
    var body: some View {
        
        VStack(spacing: 20) {
            
            Text("This text has a dark text color!")
                .foregroundColor(Color.black)
                .padding()
    
            TextField("Enter your text here. . .", text: $string)
                .background(Color.red)
                .foregroundColor(Color.black)

            Picker(selection: $selectedColor, label: Text(String())) {

                ForEach(colorArray.indices, id: \.self) { index in

                    Text(colorArray[index])
                        .foregroundColor(Color.black)
                    
                }

            }

            
            Text("This text has a normal text color!")
                .foregroundColor(Color.primary)
                .padding()
            
        }
        .padding()
        .background(Color.red)
        .cornerRadius(10)
  
    }
}