TechnologiesSwiftUIControls and Style Configurations

ButtonStyleConfiguration struct

iOSmacOStvOSwatchOSvisionOSiOS 13.0+✓ renders

The properties of a button.

How it works

A ButtonStyleConfiguration carries the information SwiftUI hands to a custom button style when it needs to draw a button. When you conform a type to ButtonStyle, the framework calls your makeBody(configuration:) method and passes one of these structures, giving you the button's label and its current interaction state without exposing the button's internals. Reach for it whenever you want a button's appearance to be reusable and driven by SwiftUI's own state tracking rather than reimplementing press handling or hard-coding a single label.

  1. Receive the configuration in makeBody(configuration:)

    ButtonStyle's single requirement, makeBody(configuration:), is where the style produces its view, and its parameter is a ButtonStyleConfiguration. In the example, FilledButtonStyle implements makeBody(configuration:) and uses the typealias Configuration for the parameter type; everything the style needs to render arrives through that one value.

  2. Place the button's content with the label property

    The label property is an opaque view representing whatever content the call site gave the button, already type-erased so you can position and decorate it freely. The example anchors its layout on configuration.label, then applies .font(.headline), padding, .background, .foregroundStyle, and .clipShape around it, so the style controls chrome while the button keeps its original text.

  3. React to touches with isPressed

    The isPressed Boolean reflects whether the user is currently pressing the button, letting the style respond to interaction without any gesture code of its own. Here configuration.isPressed selects between two fills, Color.blue.opacity(0.6) while pressed and Color.blue at rest, giving the button a built-in pressed appearance.

  4. Apply the style with the buttonStyle(_:) modifier

    A ButtonStyle is attached to a button (or a view hierarchy of buttons) through the buttonStyle(_:) modifier, which is what causes SwiftUI to build and pass a ButtonStyleConfiguration in the first place. The example wires it up with .buttonStyle(FilledButtonStyle()) on the Button("Save Changes"), so the configuration's label becomes the "Save Changes" text.

Try it — Add .scaleEffect(configuration.isPressed ? 0.95 : 1) after .clipShape(Capsule()) to see how the isPressed property lets the configuration drive an animatable shrink on touch.

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.

ButtonStyleConfiguration.swift
struct ButtonStyleConfigurationDemo: View {
    struct FilledButtonStyle: ButtonStyle {
        func makeBody(configuration: Configuration) -> some View {
            configuration.label
                .font(.headline)
                .padding(.horizontal, 20)
                .padding(.vertical, 12)
                .background(configuration.isPressed ? Color.blue.opacity(0.6) : Color.blue)
                .foregroundStyle(.white)
                .clipShape(Capsule())
        }
    }

    var body: some View {
        Button("Save Changes") {}
            .buttonStyle(FilledButtonStyle())
            .padding()
    }
}
Live preview
Save Changes
Save Changes
swift → lexer → parser → sema → uiir → canvas Open in Studio ↗
What's new in SwiftUI 27 →