How do I add Navigation to my swiftui app?

Asked on 08/09/2024

1 search

To add navigation to your SwiftUI app, you can use the NavigationStack and NavigationLink components. Here's a basic example to get you started:

  1. Create a NavigationStack: This is the container for your navigable views.
  2. Use NavigationLink: This is used to navigate to a new view when a user interacts with a UI element.

Here's a simple example:

import SwiftUI

struct ContentView: View {
    var body: some View {
        NavigationStack {
            List {
                NavigationLink("Go to Detail View", destination: DetailView())
            }
            .navigationTitle("Home")
        }
    }
}

struct DetailView: View {
    var body: some View {
        Text("This is the detail view")
            .navigationTitle("Detail")
    }
}

@main
struct MyApp: App {
    var body: some Scene {
        WindowGroup {
            ContentView()
        }
    }
}

In this example:

  • NavigationStack is used to wrap the content that will be navigable.
  • NavigationLink is used to create a link to the DetailView.
  • navigationTitle sets the title for the navigation bar.

For more advanced navigation features, such as split views or customizable multi-column tables, you can refer to the session SwiftUI essentials which covers these topics in detail.

Relevant Sessions

These sessions provide a comprehensive overview of the new features and best practices for using navigation in SwiftUI.