How to get bordered buttons that stand out
About 2 min
How to get bordered buttons that stand out 관련
SwiftUI by Example
Back to Home
How to get bordered buttons that stand out | SwiftUI by Example
How to get bordered buttons that stand out
Updated for Xcode 15
New in iOS 15
SwiftUI has a dedicated .bordered
button style that mimics a common look and feel used across many of Apple's apps. In its most basic form it looks like this:
Button("Buy: $0.99") {
print("Buying…")
}
.buttonStyle(.bordered)

However, for buttons that should really stand out on the screen, you are likely to want to use the borderedProminent
option to make their color much stronger:
Button("Buy: $0.99") {
print("Buying for $0.99")
}
.buttonStyle(.borderedProminent)

Important
Having lots of prominent buttons is not good UI practice.
You can customize the color of these buttons either by using tint()
:
Button("Submit") {
print("Submitting…")
}
.tint(.indigo)
.buttonStyle(.borderedProminent)

Or by attaching a role to the button:
Button("Delete", role: .destructive) {
print("Deleting…")
}
.buttonStyle(.borderedProminent)

Similar solutions…
How to add custom swipe action buttons to a List row | SwiftUI by Example
How to add custom swipe action buttons to a List row
How to let users customize toolbar buttons | SwiftUI by Example
How to let users customize toolbar buttons
How to create a toolbar and add buttons to it | SwiftUI by Example
How to create a toolbar and add buttons to it
How to add actions to alert buttons | SwiftUI by Example
How to add actions to alert buttons
How to make buttons that repeat their action when pressed | SwiftUI by Example
How to make buttons that repeat their action when pressed