TechnologiesSwiftUI

Commands protocol

iOSmacOStvOSwatchOSvisionOS✓ renders

Conforming types represent a group of related commands that can be exposed

How it works

Commands is the protocol you adopt to describe a scene's menu bar and keyboard command structure declaratively, the same way View describes an interface. Conforming types expose a body of type some Commands, built from command primitives like CommandMenu, CommandGroup, and CommandGroupPlacement, so menu items and their shortcuts live in their own composable, testable unit rather than being wired up imperatively. Reach for Commands when an app needs to add, replace, or remove top-level menu commands and global keyboard shortcuts, and attach that definition to a scene with the commands(content:) modifier.

  1. Conform a type to Commands and provide a body

    Adopting Commands is parallel to adopting View: you implement a body computed property whose result type is some Commands. Here DemoCommands conforms to Commands and its var body: some Commands returns the command content, giving you a single value that represents an entire block of menu commands.

  2. Add a top-level menu with CommandMenu

    CommandMenu is a command primitive that inserts a brand-new menu into the menu bar, after the app's standard menus. Its label becomes the menu title and its trailing closure holds the menu's items. In the example CommandMenu("Actions") creates an Actions menu whose body contains the individual command buttons.

  3. Express each command as a Button inside the menu

    Commands are ordinary Button values; SwiftUI renders them as menu items and runs their action when chosen. The Refresh and Clear buttons supply both the visible menu titles and the closures that fire when the user selects them.

  4. Bind a keyboard shortcut with keyboardShortcut

    The keyboardShortcut(_:) modifier attaches a global key equivalent to a command so it can be invoked without opening the menu. Applying .keyboardShortcut("r") and .keyboardShortcut("k") binds Command-R to Refresh and Command-K to Clear, mirroring the \u2318R and \u2318K hints shown alongside the menu.

Try it — Add a third Button("Reset") {} with .keyboardShortcut("l") inside the CommandMenu("Actions") block to watch a new item and its Command-L shortcut join the same menu.

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.

Commands.swift
struct CommandsDemo: View {
    struct DemoCommands: Commands {
        var body: some Commands {
            CommandMenu("Actions") {
                Button("Refresh") {}
                    .keyboardShortcut("r")
                Button("Clear") {}
                    .keyboardShortcut("k")
            }
        }
    }

    var body: some View {
        VStack(alignment: .leading, spacing: 8) {
            Text("Custom Menu Commands")
                .font(.headline)
            Label("Actions \u{203A} Refresh  \u{2318}R", systemImage: "arrow.clockwise")
            Label("Actions \u{203A} Clear  \u{2318}K", systemImage: "trash")
        }
        .padding()
    }
}
Live preview
Custom Menu Commands Actions \u{203A} Refresh \u{2318}R Actions \u{203A} Clear \u{2318}K
Custom Menu Commands Actions \u{203A} Refresh \u{2318}R Actions \u{203A} Clear \u{2318}K
swift → lexer → parser → sema → uiir → canvas Open in Studio ↗
What's new in SwiftUI 27 →