iOS 26 introduces new capabilities for customizing navigation bars in SwiftUI — including navigation subtitles, the ToolbarSpacer, and more powerful ToolbarItemGroup placement. In this tutorial, we’ll build a small demo that showcases how to use these features.
PS: The code in this post is available here.
🧱 Step 1: Set up a navigation view with a list
Use NavigationView to gain access to the new iOS 26 toolbar system.
if #available(iOS 26, *) {
NavigationView {
List {
LinearGradient(colors: [.blue, .green], startPoint: .leading, endPoint: .trailing)
.listRowInsets(.init())
Toggle("Enables Toolbar Spacer", isOn: $isToolbarSpacerEnabled)
Text("Item 1")
Text("Item 2")
Text("Item 3")
}
}
}
Using #available(iOS 26, *) ensures that the new APIs don’t cause crashes on older OS versions.
The linear gradient is just for demo purpose to make the glass effect more visible.
🔤 Step 2: Set the Navigation Title and Subtitle
New in iOS 26 is the .navigationSubtitle(_:) modifier. This lets you add a small subtitle under the main title.
.navigationTitle(Text("Favorites"))
.navigationSubtitle("Synced just now")
See the subtitle below the regular nav title? As always, when your scroll up, both titles in large display mode will become inline automatically.
We now define toolbar items, for example with three buttons.
.toolbar {
ToolbarItem(placement: .topBarTrailing) {
Button("Add", systemImage: "plus") { }
}
ToolbarItem(placement: .topBarTrailing) {
Button("Download", systemImage: "square.and.arrow.down") { }
}
ToolbarItem(placement: .topBarTrailing) {
Button("Share", systemImage: "square.and.arrow.up") { }
}
}
See in iOS 26, the new design grouped all three toolbar items together. Also, inline navtile title and subtile got pushed to the leading side if trailing items took much space.
iOS 26 introduces ToolbarSpacer, which gives you fine-grained control over toolbar layout. Let’s replace the toolbar content with the code below.
ToolbarItemGroup(placement: .topBarTrailing) {
Button("Add", systemImage: "plus") { }
Button("Download", systemImage: "square.and.arrow.down") { }
}
ToolbarSpacer(placement: .topBarTrailing)
ToolbarItemGroup(placement: .topBarTrailing) {
Button("Share", systemImage: "square.and.arrow.up") { }
}
Using ToolbarItemGroup allows us to group buttons together, while ToolbarSpacer inserts spacing between them to seperate different type of functionalities.
✅ Summary
With iOS 26, SwiftUI gives us:
navigationSubtitle(_:) for better context in navigation bars
ToolbarItemGroup to logically group actions
ToolbarSpacer to space groups apart visually and functionally
These additions make it easier to design adaptive, organized toolbars that better reflect user intent.
This lets you separate logical sections of toolbar items — improving both UX and layout responsiveness.
Don’t forget to subscribe to my newsletter if you’d like to receive posts like this via email. If you like my posts, 😚consider tipping me at buymeacoffee.com/xavierios.
