Sidebar
The Sidebar is a List that is embeded inside a Navigation View. You can customize the title and the layout will automatically adapt to the iPhone and iPad in portrait and landscape modes.
NavigationView {
List {
Label("Courses", systemImage: "book")
Label("Tutorials", systemImage: "square")
}
.navigationTitle("Learn")
}
Initial Screen and Title
To set your initial screen, you’ll need to declare your View after the List.
NavigationView {
HomeView()
}
A Navigation Title is set inside that View.
struct HomeView: View {
var body: some View {
Text("Courses")
.navigationTitle("Courses")
}
}
Navigation Link
To allow navigation, you’ll need to set a NavigationLink for each List item.
NavigationLink(destination: HomeView()) {
Label("Courses", systemImage: "book")
}
Portrait and Landscape Modes
The Sidebar menu will adapt in 3 ways between iPhones and iPads: