How it works
NavigationSplitViewVisibility is a value type whose constants describe how many columns a NavigationSplitView currently shows. A multi-column split view can present its sidebar, content, and detail in several arrangements depending on platform, size class, and user action, and this type names those arrangements so your code can both read and drive them. Reach for it when you want to observe or programmatically control whether the leading columns are revealed or collapsed, rather than leaving that entirely to the system.
Store the visibility in observable state
Because the value changes as the layout expands and collapses, hold it in a property that triggers view updates. The example declares
@State private var columnVisibility: NavigationSplitViewVisibility = .all, giving the split view a starting arrangement and a place to record later changes.Choose a starting constant
The type vends constants for each arrangement:
.allshows every column,.doubleColumnfavors the content and detail columns,.detailOnlycollapses the leading columns to foreground the detail, and.automaticdefers to the system's default. The example begins at.allso theListsidebar is visible on launch.Bind it to NavigationSplitView
A NavigationSplitView accepts the visibility through its
columnVisibilityparameter as a binding, so reads and writes flow both ways. The example passesNavigationSplitView(columnVisibility: $columnVisibility), letting the system update the value when the user toggles columns while still honoring values you set.Mutate the state to drive the layout
Assigning a new constant to the bound property changes the visible arrangement, and SwiftUI animates the transition. Setting
columnVisibility = .detailOnly, for instance, hides theListof mailboxes and surfaces thedetailcontent, while.allbrings the sidebar back.
@State private var columnVisibility: NavigationSplitViewVisibility = .all to .detailOnly and watch the "Mailboxes" list start hidden, leaving only the detail column on screen.Example & preview
Press Run live & edit to compile it in your browser — then edit the Swift on the left and the preview re-renders live.
struct NavigationSplitViewVisibilityDemo: View {
@State private var columnVisibility: NavigationSplitViewVisibility = .all
@State private var selection: String? = "Inbox"
var body: some View {
NavigationSplitView(columnVisibility: $columnVisibility) {
List(["Inbox", "Sent", "Drafts"], id: \.self, selection: $selection) { item in
Text(item)
}
.navigationTitle("Mailboxes")
} detail: {
Text(selection ?? "No selection")
.font(.title)
.padding()
}
.padding()
}
}