How to pop view from Navigation stack in iOS 16

In iOS 16, Apple did a big revamp on the navigation view architecture. They deprecated the NavigationView and replaced it with the NavigationStack.

In this article, we will learn how to pop or dismiss a view from a navigation stack in iOS 16.

There are two ways to pop view out of a navigation view in SwiftUI.

1. Using an Environment value.
2. Using path.

Environment Value

Let's start with the simplest one.

SwiftUI provides an Environment value, DismissAction, that we can use to dismiss the pushed view.

We declare and use this value within the destination view.

struct DetailView: View {
    // 1
    @Environment(\.dismiss) private var dismiss
    
    var body: some View {
        Button("Dismiss") {
            // 2
            dismiss()
        }
        .navigationTitle("Detail Title")
    }
}

struct ContentView: View {
    var body: some View {
        NavigationStack {
            NavigationLink("Detail") {
                DetailView()
            }
            .navigationTitle("Home")
        }
        
    }
}

1 We declare the dismiss environment value in the destination view (DetailView).
2 Then call dismiss() to perform the dismissal.

Here is the result. We can pop a view programmatically by calling dismiss().

You can easily support sarunw.com by checking out this sponsor.

AI Grammar: Correct grammar, spell check, check punctuation, and parphrase.

Try it for Free

Path

NavigationStack got a big improvement around programmatic navigation.

We can now set an array, path, which acts as a data source of our navigation view.

NavigationStack keeps all views that get pushed to the navigation stack in the form of array, path.

• To push a new view to a navigation view, we add a new item to the path array.
• To pop a view, we remove an item from the path array.

In this example, we have a list of color names. Tapping each name will bring you to the ColorDetail view, where we use that color as a background.
ContentView

struct ContentView: View {
    // 1
    @State private var path: [Color] = []

    var body: some View {
        // 2
        NavigationStack(path: $path) {
            List {
                NavigationLink("Pink", value: Color.pink)
                NavigationLink("Yellow", value: Color.yellow)
                NavigationLink("Green", value: Color.green)
            }
            // 3
            .navigationDestination(for: Color.self) { color in
                // 4
                ColorDetail(path: $path, color: color)
            }
            .navigationTitle("Home")
        }
    }
}

1 We will use Color to represent our view, so we declare an array of Color to keep the state of our navigation stack.
2 We pass this array as a data source for our NavigationStack.
3 NavigationStack works side-by-side with the new modifier, .navigationDestination. This modifier translates path data into a destination view.
4 We return a destination view using the path data. We also pass the $path to the DetailView since we want the destination view to be able to pop itself.

ColorDetail

struct ColorDetail: View {
    // 1
    @Binding var path: [Color]
    
    let color: Color

    var body: some View {
        VStack {
            color
                .ignoresSafeArea()
            Button("Pop") {
                // 2
                path.removeLast()
            }
        }
    }
}

1 We accept the binding to the path object. We will use this for dismissal of view.
2 We dismiss the view by removing itself from the path array. The presented view is the last item in the array, so we call path.removeLast() to remove itself from the navigation stack.

Here is the result, we can pop a view out of the navigation stack by manipulating object in the path array.