How it works
BorderlessButtonMenuStyle is the menu style that presents a Menu as a borderless button, dropping the standard bezel and chrome so the trigger reads as plain, tappable text or a symbol. It addresses the case where a full bordered control would feel too heavy — inline actions, toolbar-adjacent affordances, or compact layouts — while keeping the menu's pull-down behavior intact. Reach for it when you want a Menu to blend into surrounding content rather than stand apart as a framed button. You apply it through the menuStyle(_:) modifier rather than constructing it directly.
Build the pull-down with Menu
BorderlessButtonMenuStyle restyles a
Menu, so the menu is the thing you style. The label argument ("Options") becomes the borderless trigger, and the closure holds the actions that appear when it opens — here theButton("Rename"),Button("Duplicate"), andButton("Delete", role: .destructive)entries.Apply it with menuStyle(.borderlessButton)
You never instantiate BorderlessButtonMenuStyle yourself; you attach it with the
menuStyle(_:)modifier. The.borderlessButtonshorthand resolves to this style, telling the menu to render its label as a borderless button instead of the default framed pull-down.Understand the borderless presentation
Where the default style draws a bordered button, BorderlessButtonMenuStyle strips that border so the
"Options"label sits flush with its surroundings. The menu still opens on tap and dismisses on selection — only the visual weight of the trigger changes, which is what makes it suited to inline and toolbar contexts.Let roles drive item appearance
The borderless trigger doesn't change how items inside behave: roles still apply within the menu.
Button("Delete", role: .destructive)is rendered in its destructive treatment in the opened menu, independent of the borderless styling on the label itself.Reuse via the conformance
BorderlessButtonMenuStyle conforms to the
MenuStyleprotocol, which is why it slots intomenuStyle(_:)alongside other styles. Because the modifier propagates through the environment, applying it once — as on thisMenu— styles that menu and any menus nested below it in the same hierarchy.
.menuStyle(.borderlessButton) to .menuStyle(.button) and watch the same "Options" Menu gain a full bordered button bezel, making the borderless style's flush, chrome-free trigger obvious by contrast.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.
struct BorderlessButtonMenuStyleDemo: View {
var body: some View {
Menu("Options") {
Button("Rename") {}
Button("Duplicate") {}
Button("Delete", role: .destructive) {}
}
.menuStyle(.borderlessButton)
.padding()
}
}