How it works
MenuControlGroupStyle is a control group style that collapses the controls of a ControlGroup into a single menu, presenting the grouped actions behind one button that expands on demand rather than laying them out inline. Reach for it when a ControlGroup holds several related commands but you want them tucked away to conserve space — for example in a toolbar or a compact region where a row of buttons would crowd the layout. You apply it through the controlGroupStyle(_:) modifier using the .menu shorthand, and SwiftUI handles building the menu affordance and its presentation for you.
Group the commands with ControlGroup
MenuControlGroupStylestyles the contents of aControlGroup, so the controls you want to consolidate go inside its closure. In the example, threeButtoncontrols labeledCut,Copy, andPasteare declared as the group's children; the style determines how that set is displayed, not which controls belong to it.Apply the style with controlGroupStyle(.menu)
The
controlGroupStyle(_:)view modifier sets the style for control groups in its subtree. Passing.menuselectsMenuControlGroupStyle, the static accessor that resolves to this style, which is why the example writes.controlGroupStyle(.menu)rather than constructing the type directly.Let the style fold the controls into one menu
Under
MenuControlGroupStyle, the grouped controls no longer render as side-by-side buttons; instead they become entries in a menu reached through a single trigger. TheLabelof eachButton—Label("Cut", systemImage: "scissors")and its siblings — supplies the title andsystemImagefor the corresponding menu item.Rely on conformance to ControlGroupStyle
MenuControlGroupStyleconforms toControlGroupStyle, the protocol that defines how a control group's body is built from its configuration. That conformance is what makes it a valid argument tocontrolGroupStyle(_:), and it lets you swap to other built-in styles such as.automaticor.navigationwithout changing theControlGroupitself.
.controlGroupStyle(.menu) to .controlGroupStyle(.automatic) and watch the Cut, Copy, and Paste buttons spread out inline instead of folding behind a single menu 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.
struct MenuControlGroupStyleDemo: View {
var body: some View {
ControlGroup {
Button {
} label: {
Label("Cut", systemImage: "scissors")
}
Button {
} label: {
Label("Copy", systemImage: "doc.on.doc")
}
Button {
} label: {
Label("Paste", systemImage: "doc.on.clipboard")
}
}
.controlGroupStyle(.menu)
.padding()
}
}