Custom NavigationView Bar in SwiftUI
Using custom colors in the navigation bar
NavigationView is SwiftUI’s counterpart to UIKit’s UINavigationController. A NavigationView is defined by Apple as “A view for presenting a stack of views representing a visible path in a navigation hierarchy”. In other words, it allows you to do hierarchical navigation between views and adds a navigation bar at the top of the screen.
SwiftUI’s default navigation bar is colored white with black text, and the opposite when dark mode is enabled.
In SwiftUI, there’s currently no simple way of customizing the top navigation bar (i.e. changing the navigation bar’s color). SwiftUI does support, however, the ability to create custom view modifiers that let us modify or style a view as desired. Some built-in modifiers include font(), navigationBarTitle(), and foregroundColor(), among others.
In this article, I will show you how you can create a custom ViewModifier that you can use to easily customize the navigation bar inside your NavigationView. To create your modifier you first need to define a struct that conforms to the ViewModifier protocol. Let’s define a NavigationBarColor struct:
