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

Question

我有以下代码。如果我更改.background(Color.green)为.background(Color.white)VStack，背景将是我用于 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")
        }
    }
}

这会给你这个结果：