Menu
Coddy logo textTech

NavigationStack

Part of the Introduction to SwiftUI section of Coddy's Swift journey. Lesson 34 of 50.

A NavigationStack gives a screen a navigation bar and lets it push other screens on top. Wrap the screen's content in it and give the content a title:

NavigationStack {
    List {
        Text("Inbox")
        Text("Sent")
    }
    .navigationTitle("Mail")
}

Notice where .navigationTitle goes: on the content inside the stack, not on the NavigationStack itself. The stack reads the title from the screen it is showing, so each screen can set its own.

By default the title is large. .navigationBarTitleDisplayMode(.inline) shows it small, in the middle of the bar.

challenge icon

Challenge

Easy

Wrap the list in a NavigationStack with the identifier nav, and give the list the title Recipes.

Try it yourself

import SwiftUI

@main
struct CoddyApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
        }
    }
}
quiz iconTest yourself

This lesson includes a short quiz. Start the lesson to answer it and track your progress.

All lessons in Introduction to SwiftUI

Practice on your own: Swift playground