Managing Multiple NavigationBars in SwiftUI

After exploring SwiftUI for quite a while, one of the most cumbersome things I encounter is to manage multiple kinds of navigation bars in an app.

Thankfully, we have ViewModifier, which allows you to create your own custom modifiers like .padding() and .font(). In this short article, I will show you a common design where a main view and a modal have different navigation bars. In this case, you are managing two separate navigation views.

This is how the app looks like:

Firstly, create a new ViewModifiercall NavigationBarModifier. In this struct you give it two parameters backgroundColor and textColor. Then, extend View so that you can call the method like .navigationBarColor(). Here’s the code:

Next, create the two navigation bars with different background colors like this: