palette

Declaration

@MainActor @preconcurrency static var palette: PaletteControlGroupStyle { get }

Discussion

Use this style to render a multi-select or a stateless palette. The following example creates a control group that contains both type of shelves:

Menu {
    // A multi select palette
    ControlGroup {
        ForEach(ColorTags.allCases) { colorTag in
            Toggle(isOn: $selectedColorTags[colorTag]) {
                Label(colorTag.name, systemImage: "circle")
            }
            .tint(colorTag.color)
        }
    }
    .controlGroupStyle(.palette)
    .paletteSelectionEffect(.symbolVariant(.fill))

    // A momentary / stateless palette
    ControlGroup {
        ForEach(Emotes.allCases) { emote in
            Button {
                sendEmote(emote)
            } label: {
                Label(emote.name, systemImage: emote.systemImage)
            }
        }
    }
    .controlGroupStyle(.palette)
}

To apply this style to a control group, or to a view that contains control groups, use the controlGroupStyle(_:) modifier.

See Also

Getting built-in control group styles

• automatic
• compactMenu
• menu
• navigation