Protocol¶
PrimitiveButtonStyle¶
This protocol is used to define custom button styles.¶
Declaration¶
protocol PrimitiveButtonStyle
Overview¶
Use this protocol to define custom styling and interaction behavior for buttons.
- Note: This protocol gives you a way trigger the button programmatically. If you would like to detect when the button is being pressed, use ButtonStyle instead.
Creating a PrimitiveButtonStyle¶
There are two ways to make a PrimitiveButtonStyle:
- Use one of SwiftUI's out-of-the-box options
- Create your own style by making a structure that implements the makeBody(configuration:) function.
Out-Of-The-Box PrimitiveButtonStyle¶
There are 3 primitive button styles that ship with SwiftUI:
Create Your Own PrimitiveButtonStyle¶
To conform to PrimitiveButtonStyle, your structure only needs to implement one method: makeBody(configuration:).
makeBody(configuration:) accepts a PrimitiveButtonStyleConfiguration, which passes the original PrimitiveButtonStyleConfiguration/label to display the button view and a trigger() to execute its action. A gesture is commonly added to the label in order to trigger the button action.
struct MyPrimitiveButtonStyle: PrimitiveButtonStyle {
func makeBody(configuration: Configuration) -> some View {
configuration.label
.foregroundColor(.yellow)
.onTapGesture { configuration.trigger() }
}
}
Using PrimitiveButtonStyle¶
Use buttonStyle(_:) to apply a primitive button style.
struct ExampleView: View {
var body: some View {
Button("Banana 🍌🍌", action: tap)
.buttonStyle(MyPrimitiveButtonStyle())
}
func tap() { /\* implement here \*/ }
}

PrimitiveButtonStyle applies to all buttons within a view hierarchy. For example, you could apply BananaButtonStyle to a VStack.
struct BananaView: View {
var body: some View {
VStack {
Button("Banana 🍌🍌", action: { tap() })
Button("Apple 🍏🍏", action: { tap() })
Button("Peach 🍑🍑", action: { tap() })
}
.buttonStyle(BananaButtonStyle(color: .yellow))
}
func tap() { /\* implement here \*/ }
}
struct BananaButtonStyle: PrimitiveButtonStyle {
let color: Color
func makeBody(configuration: Configuration) -> some View {
configuration.label
.padding()
.background(RoundedRectangle(cornerRadius: 10).fill(color))
.onTapGesture { configuration.trigger() }
}
}

Availability¶
iOS 13.0+
macOS 10.15+
tvOS 13.0+
watchOS 6.0+
Topics¶
Type Alias¶
Configuration The properties of a button.
Associated Type¶
Body A view that represents the body of a button.
Instance Method¶
makeBody(configuration:) Creates a view that represents the body of a button.