TechnologiesSwiftUI

ButtonMenuStyle struct

iOSmacOStvOSwatchOSvisionOS✓ renders

A menu style that displays a button that toggles the display of the

How it works

ButtonMenuStyle is the MenuStyle that draws a Menu as a single tappable button, which expands to reveal its contents when activated. It's the default presentation for menus on most platforms, giving you a self-contained control that shows its label up front and defers the list of actions until the user opens it. Reach for it when you want a compact menu trigger — a toolbar item, an inline "Options" control, or any place a button-shaped affordance reads more clearly than a bare disclosure.

  1. Build the menu with Menu

    ButtonMenuStyle styles a Menu, so you start by declaring one with a label and a content closure of actions. In the example, Menu("Options") supplies the visible label, and the trailing closure holds the menu's commands — the menu is the view the style will reshape into a button.

  2. Populate the menu with Button items

    The menu's content is a set of controls the style presents once the button is opened. Here three Button items — "Rename", "Duplicate", and a .destructive-role "Delete" — become the rows revealed on activation, while ButtonMenuStyle itself governs only the closed, button-shaped trigger.

  3. Apply the style with .menuStyle(.button)

    You don't instantiate ButtonMenuStyle directly; you select it through the menuStyle(_:) modifier using the .button shorthand, which resolves to ButtonMenuStyle. In the example, .menuStyle(.button) is attached to the Menu, telling SwiftUI to render the "Options" label as a button that discloses its items.

  4. Let the style propagate through the environment

    menuStyle(_:) sets the style for the menu it's applied to and for any menus nested within that view hierarchy, so a single .menuStyle(.button) can govern a whole subtree. Surrounding layout — such as the .padding() that follows — only positions the resulting button and doesn't alter how ButtonMenuStyle presents the menu.

Try it — Swap .menuStyle(.button) for a different MenuStyle such as .borderlessButton (or remove the modifier entirely) to see how ButtonMenuStyle specifically frames the "Options" menu as a bordered button trigger.

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.

ButtonMenuStyle.swift
struct ButtonMenuStyleDemo: View {
    var body: some View {
        Menu("Options") {
            Button("Rename", action: {})
            Button("Duplicate", action: {})
            Button("Delete", role: .destructive, action: {})
        }
        .menuStyle(.button)
        .padding()
    }
}
Live preview
Options
Options
swift → lexer → parser → sema → uiir → canvas Open in Studio ↗
What's new in SwiftUI 27 →