Cracking the Navigation Bar Secrets with SwiftUI

Navigating from one view to another, or simply showing a title and buttons, is one of the most crucial building blocks of modern iOS applications. Almost every app has this feature. SwiftUI brings some new approaches for how to show the Navigation Bar, set the title, and add buttons. So let’s check it out.

Photo by Egor Myznik on Unsplash.

Showing Navigation View

To show a Navigation Bar using SwiftUI, we should use the NavigationView component that is responsible for this purpose. It requires that we provide the Content that is a View type. The Content can be anything from a text field to scrollable content. In short, it can be any SwiftUI view.

To show a title for the navigation, SwiftUI has a completely different approach than we are used to with UIKit. We should set it as a view modifier, not for the NavigationView, but the Content.

var body: some View {
  NavigationView {
    Text("Hello, world!")
      .navigationTitle("Title")
  }
}

SwiftUI framework provides a means to specify the size of the NavigationView. We want to use the .navigationBarTitleDisplayMode modifier for the Content and provide a display…