TechnologiesSwiftUI

LabeledControlGroupContent struct

iOSmacOStvOSwatchOSvisionOS✓ renders

A view that represents the body of a control group with a specified

How it works

LabeledControlGroupContent is the view type SwiftUI assembles for you when you create a ControlGroup that pairs a group of controls with its own label. You don't instantiate it directly; it's the opaque content returned by the ControlGroup initializer that takes both a content closure and a separate label closure, and it carries the relationship between the grouped controls and the text or symbol that titles them. Reach for this form of ControlGroup when a cluster of related actions needs a heading that the system can present, narrate, or collapse together depending on the control group's style and placement.

  1. Build the group with the labeled ControlGroup initializer

    LabeledControlGroupContent is produced by the ControlGroup initializer that accepts a content closure followed by a label closure, rather than the bare content-only form. Declaring both closures is what tells SwiftUI to wrap the controls and their title into a single labeled group, as the demo does by following the ControlGroup { ... } label: { ... } structure.

  2. Populate the content closure with the grouped controls

    The first closure supplies the controls SwiftUI bundles into the group's content. Here it holds two Button views, each presenting a Label, like Label("Add", systemImage: "plus") and Label("Remove", systemImage: "minus"). These become the members of the labeled content, laid out and styled together according to the active control group style.

  3. Supply the heading in the label closure

    The trailing label closure provides the title associated with the whole group, which is the part that distinguishes this view type from an unlabeled control group. In the example that label is Text("Items"), giving the cluster a heading the system can show, read aloud for accessibility, or surface when the group collapses into a menu.

  4. Adjust presentation with control group styling and layout

    Because the labeled content is still an ordinary view, you shape it with standard modifiers and styles. The demo applies .padding() to give the group room, and you'd reach for .controlGroupStyle(_:) to switch between layouts such as a compact navigation bar arrangement or a menu, which also governs how prominently the label is shown.

Try it — Change the label closure from Text("Items") to Label("Items", systemImage: "square.stack") to see how the labeled group surfaces a symbol alongside its heading.

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.

LabeledControlGroupContent.swift
struct LabeledControlGroupContentDemo: View {
    var body: some View {
        ControlGroup {
            Button {
            } label: {
                Label("Add", systemImage: "plus")
            }
            Button {
            } label: {
                Label("Remove", systemImage: "minus")
            }
        } label: {
            Text("Items")
        }
        .padding()
    }
}
Live preview
Items Add Remove
Items Add Remove
swift → lexer → parser → sema → uiir → canvas Open in Studio ↗
What's new in SwiftUI 27 →