How it works
BalancedNavigationSplitViewStyle is a NavigationSplitViewStyle that lays out a NavigationSplitView so its columns share the available width rather than letting the detail column dominate. When the sidebar and detail are shown together, this style sizes the leading columns to their content and gives the remaining space to the detail, keeping every column comfortably visible at once. Reach for it when you want a multi-column layout where the sidebar stays prominent alongside the detail, instead of collapsing or shrinking as the detail grows.
Apply the style with navigationSplitViewStyle(.balanced)
You don't construct BalancedNavigationSplitViewStyle directly; you attach it to a NavigationSplitView through the navigationSplitViewStyle(_:) modifier, which takes any value conforming to NavigationSplitViewStyle. The
.balancedshorthand resolves to this style, as in.navigationSplitViewStyle(.balanced)on the split view's body.Style the whole NavigationSplitView, not a single column
The modifier governs how the entire split view distributes width across its columns, so it goes on the NavigationSplitView itself rather than on the sidebar or detail content. Here it sits on the view that pairs the sidebar
List(folders, id: \.self, selection: $selection)with thedetail:closure.Provide the sidebar and detail it balances
The style needs the columns it will balance: the leading sidebar and the trailing detail you supply to NavigationSplitView. In this code the sidebar is the
Listoffolderstitled"Mail", and the detail is theText(selection ?? "No selection")that reflects the currentselection.Drive the detail through selection so balancing is visible
Balancing matters most when the detail has real content to occupy its share of the width. The
@State private var selectionbound into the List withselection: $selectionupdates the detail'sText, letting you see how the balanced columns hold their proportions as the chosenfolderchanges.
.navigationSplitViewStyle(.balanced) to .navigationSplitViewStyle(.prominentDetail) and compare how much width the sidebar List keeps versus the detail Text.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 BalancedNavigationSplitViewStyleDemo: View {
@State private var selection: String? = "Inbox"
let folders = ["Inbox", "Sent", "Drafts"]
var body: some View {
NavigationSplitView {
List(folders, id: \.self, selection: $selection) { folder in
Label(folder, systemImage: "folder")
}
.navigationTitle("Mail")
} detail: {
Text(selection ?? "No selection")
.font(.title2)
.padding()
}
.navigationSplitViewStyle(.balanced)
}
}