NavigationView dynamic background color in SwiftUI

Problem

As you may noticed, customizing navigation bar using only SwiftUI standard NavigationView is not possible in the first release of SwiftUI (as of Xcode 11), as no API is provided to change the background color. More over you as you don’t have access to NavigationBarController is really hard to achieve any customization.

In this article, I will show you how to compose your view to get the intended behavior.

Solution

Where are going to create custom modifier so we can change the color of NavBar on every view. The usage will be then as follow

An here is implementation. Fist of all we will create our modifier:

And then we will extend the view so we can use it anywhere in SwiftUI scope.

References

• [1] https://stackoverflow.com/questions/56859095/swiftui-using-geometryreader-without-modifying-the-view-size
• [2] https://www.hackingwithswift.com/books/ios-swiftui/custom-modifiers
• [3] https://swiftwithmajid.com/2019/12/18/the-power-of-viewbuilder-in-swiftui/