Updated for Xcode 14.0 beta 1
SwiftUI’s toolbar()
modifier lets us place bar button items anywhere in the top or bottom space, but only when our view is embedded inside a NavigationView
.
If you want to place buttons into a toolbar at the bottom of the screen, use toolbar()
then create a ToolbarItem
with the placement of .bottomBar
, like this:
NavigationView {
Text("Hello, World!").padding()
.navigationTitle("SwiftUI")
.toolbar {
ToolbarItem(placement: .bottomBar) {
Button("Press Me") {
print("Pressed")
}
}
}
}
To get more than one button, use ToolbarItemGroup
instead of a simple ToolbarItem
, then place multiple buttons inside there:
NavigationView {
Text("Hello, World!").padding()
.navigationTitle("SwiftUI")
.toolbar {
ToolbarItemGroup(placement: .bottomBar) {
Button("First") {
print("Pressed")
}
Button("Second") {
print("Pressed")
}
}
}
}
If you want to separate buttons inside a ToolbarItemGroup
, add a spacer view wherever you want it. For example, this will place one button on the left edge of the toolbar, and one on the right edge:
NavigationView {
Text("Hello, World!").padding()
.navigationTitle("SwiftUI")
.toolbar {
ToolbarItemGroup(placement: .bottomBar) {
Button("First") {
print("Pressed")
}
Spacer()
Button("Second") {
print("Pressed")
}
}
}
}
SPONSORED You know StoreKit, but you don’t want to do StoreKit. RevenueCat makes it easy to deploy, manage, and analyze in-app subscriptions on iOS and Android so you can focus on building your app.
Sponsor Hacking with Swift and reach the world's largest Swift community!
Link copied to your pasteboard.