NavigationView – SwiftUI

NavigationView in SwiftUI is a view for presenting a stack of views representing a visible path in a navigation hierarchy.

Check out NavigationStack Tutorial, because NavigationView is outdated

How to create a NavigationView in SwiftUI

Let’s create a simple NavigationView using SwiftUI.

        NavigationView {
            List {
                Text("Item1")
                Text("Item2")
                Text("Item3") }.navigationBarTitle(Text("ContentView"))
        }

How to change the style of a navigationBarTitle to inline?

By default the navigationBarTitle is set to Large. to set it to inline just set the displayMode parameter to .inline:

 NavigationView {
            List {
                Text("Item1")
                Text("Item2")
                Text("Item3") }.navigationBarTitle(Text("ContentView"), displayMode: .inline)
        }

How to show a NavigationLink inside a NavigationView?

 struct ContentView: View {
    
    var body: some View {
        
        NavigationView {
            
            NavigationLink(destination: DetailView()) {
                
                Text("Tap Me")
            }.navigationBarTitle(Text("ContentView"))
            
        }
        
    }
    
}

struct DetailView: View {
    
    var body: some View {
        
        Text("Hello, I'm a Detail View")
        
    }
    
}

Find more about navigationLink here.

How to change a navigationViewStyle of a NavigationView?

If you want to run your app on iPad you should know about a navigationViewStyle. Set it to DoubleColumnNavigationViewStyle() if you want a Split view style.

struct ContentView: View {
    
    var body: some View {
        
        NavigationView {
            
            NavigationLink(destination: DetailView()) {
                
                Text("Tap Me")
            }.navigationBarTitle(Text("ContentView"))
            
            Text("Hello, I'm a Detail View")
        }.navigationViewStyle(DoubleColumnNavigationViewStyle())
        
        
    }
    
}

If you want it to show in a One-View way on iPad, use the StackNavigationViewStyle() instead. Check it on canvas or in an iPad simulator.

.navigationViewStyle(StackNavigationViewStyle())

Learn more about SwiftUI using SwiftUI Tutorials by the AppMakers

If anything will change in the future, it is OK, you can always check the official documentation.

NavigationView Documentation

Leave a comment to Submit the NEW and USEFUL code related to the topic of this post.
Submit a brief and useful code only.