Question

我想更改导航栏的背景颜色。但是，颜色看起来如此不同，我在做什么错了？

我的代码：

UINavigationBar.appearance().backgroundColor = .red

return VStack(spacing: 0) {
    Text("Test")
        .padding(.top, 9.5)
        .padding(.bottom, 8)
        .frame(minWidth: 0, maxWidth: .infinity)
        .background(Color.red)
        .font(.footnote)
    NavigationView {
        Text("Hello")
        .navigationBarTitle(Text("Hi"), displayMode: .inline)
    }
}

编辑： 使用this solution，效果会更好，但颜色仍然有所差异。

现在我的代码：

struct ContentView: View {
    var body: some View {
        VStack(spacing: 0) {
            Text("Test")
                .padding(.top, 9.5)
                .padding(.bottom, 8)
                .frame(minWidth: 0, maxWidth: .infinity)
                .background(Color("red")) // Now I use a color set
                .font(.footnote)
            NavigationView {
                Text("Hello")
                .navigationBarTitle(Text("Hi"), displayMode: .inline)
                .background(NavigationConfigurator { nc in
                    nc.navigationBar.barTintColor = UIColor(named: "red") // Now I use a color set
                })
            }
        }
    }
}

struct NavigationConfigurator: UIViewControllerRepresentable {
    var configure: (UINavigationController) -> Void = { _ in }

    func makeUIViewController(context: UIViewControllerRepresentableContext<NavigationConfigurator>) -> UIViewController {
        UIViewController()
    }
    func updateUIViewController(_ uiViewController: UIViewController, context: UIViewControllerRepresentableContext<NavigationConfigurator>) {
        if let nc = uiViewController.navigationController {
            self.configure(nc)
        }
    }
}

Answer 1

当您指定displayMode: .inline参数时，导航栏下方的颜色（在本例中为白色）将与导航栏的颜色混合，从而使您保持这种粉红色。如果标题样式较大，您将获得全红色。

This answer是一种更好的设置导航栏颜色的方法，甚至可以使用.inline样式。

最后，请注意，Color.red实际上与UIColor.systemRed相同。如果您使用UIColor.red，则会在暗模式下发现差异。

Answer 2

问题出在UINavigationBar的{{1}}上。您应该将其设置为空的backgroundImage，例如：

UIImage

如何在SwiftUI中更改导航栏的背景颜色？

2 个答案: