I want to be able to set custom colors for the NavBar and the navigationBarItems in SwiftUI. Here is the code for the navigationBarItems:
.navigationBarItems(leading: EditButton(), trailing: Button(action: {
self.showingAddScreen.toggle()
}) {
Image(systemName: "plus")
})
.sheet(isPresented: $showingAddScreen) {
NavigationView {
AddTaskView().environment(\.managedObjectContext, self.moc)
}
}
I created an extension with the following code which works well on the NavigationBar background color but it does not change the color of the navigationBarItems - they have the default button blue color.
extension UINavigationController {
override open func viewDidAppear(_ animated: Bool) {
super.viewDidAppear(animated)
let standardAppearance = UINavigationBarAppearance()
standardAppearance.backgroundColor = UIColor(red: 66/255, green: 116/255, blue: 147/255, alpha: 1.0)
let scrollEdgeAppearance = UINavigationBarAppearance()
scrollEdgeAppearance.backgroundColor = UIColor(red: 66/255, green: 116/255, blue: 147/255, alpha: 1.0)
let compactAppearance = UINavigationBarAppearance()
compactAppearance.backgroundColor = UIColor(red: 66/255, green: 116/255, blue: 147/255, alpha: 1.0)
navigationBar.standardAppearance = standardAppearance
navigationBar.scrollEdgeAppearance = scrollEdgeAppearance
navigationBar.compactAppearance = compactAppearance
navigationBar.tintColor = UIColor.white
}
}
What is the correct way to change the navigationBarItems color?
I discovered that while a universal setting might be handy, that you can actually style the .foregroundColor for each button:
.navigationBarItems(leading: EditButton().foregroundColor(Color.white), trailing: Button(action: {
self.showingAddScreen.toggle()
}) {
Image(systemName: "plus")
.foregroundColor(Color.white)
})
.sheet(isPresented: $showingAddScreen) {
NavigationView {
AddTaskView().environment(\.managedObjectContext, self.moc)
}
}