SwiftUI：VStack不适用于白色背景颜色，但适用于其他所有颜色

Question

我有以下代码。如果将VStack的.background(Color.green)更改为.background(Color.white)，则背景将是我用于Listbackground的systemGray。

与.colorMultiply(Color(UIColor.systemGray4))属性有关吗？。

var body: some View {
        NavigationView {
            List {
                Text("Bla bla bla")
                Group {
                VStack {
                    TextField("Server address", text: $serverAddress)
                        .keyboardType(.default)
                    TextField("Server port", text: $serverPortString)
                        .keyboardType(.numberPad)
                }
                }
                .padding()
                .background(Color.green)
                .cornerRadius(8)

// Some more elements
            }
            .navigationBarHidden(false)
            .navigationBarTitle("Connect your Server", displayMode: .large)
        }
        .colorMultiply(Color(UIColor.systemGray4))
        .onTapGesture {
            self.hideKeyboard()
        }

被忽略的白色背景：

工作绿色背景：

Answer 1

.colorMultiply()向应用了该视图的视图添加颜色倍增效果，这意味着它将为您添加的颜色着色。由于您的NavigationView是包含视图，因此其中的所有视图都将着色为systemGray4。

当您将其设置为white时，systemGray4会对其进行着色，以使其与背景融为一体，因为背景也是white。

---

您可以执行以下操作：

struct ContentView: View {

    @State var serverAddress: String = ""
    @State var serverPortString: String = ""

    let backgroundColor = Color.init(UIColor.systemGray4)

    init() {
        UITableView.appearance().backgroundColor = .clear // or you could set this to systemGray4 and ignore the ZStack
        UITableView.appearance().separatorColor = .clear
        UITableView.appearance().tableFooterView = UIView()
        UITableView.appearance().separatorStyle = .none
    }

    var body: some View {
        NavigationView {
            ZStack {
                backgroundColor.frame(maxWidth: .infinity, maxHeight: .infinity).edgesIgnoringSafeArea(.all)
                List {
                    Text("Bla bla bla")
                    .listRowBackground(backgroundColor)

                    Group {
                        VStack {
                            TextField("Server address", text: $serverAddress)
                                .keyboardType(.default)
                            TextField("Server port", text: $serverPortString)
                                .keyboardType(.numberPad)
                        }
                    }
                    .listRowBackground(backgroundColor)
                    .padding()
                    .background(Color.white)
                    .cornerRadius(8)


                    // Some more elements
                }
            }
            .navigationBarHidden(false)
            .navigationBarTitle("Connect your Server", displayMode: .large)

        }
        .onTapGesture {
            print("tapped")
        }
    }
}

哪个会给您这个结果：