This documentation is available as Markdown for AI agents and LLMs. See the full Markdown index or append .md to any documentation URL.
ControlGroup
用于分组交互式控件的 SwiftUI ControlGroup 组件。
Expo UI ControlGroup 与官方 SwiftUI ControlGroup API 相匹配。放置在 Menu 内时,子元素会以紧凑的水平按钮行渲染。
🌐 Expo UI ControlGroup matches the official SwiftUI ControlGroup API. When placed inside a Menu, the children are rendered as a compact horizontal row of buttons.

注意: 在 tvOS 上,
ControlGroup需要 tvOS 17.0 或更高版本。
安装
🌐 Installation
- npx expo install @expo/uiIf you are installing this in an existing React Native app, make sure to install expo in your project.
用法
🌐 Usage
基础对照组
🌐 Basic control group
菜单中的一个控制组,这些显示为一排水平的图标按钮。
🌐 A control group inside a menu, these render as a horizontal row of icon buttons.
import { Host, Menu, ControlGroup, Button } from '@expo/ui/swift-ui'; export default function BasicControlGroupExample() { return ( <Host matchContents> <Menu label="Options" systemImage="ellipsis.circle"> <ControlGroup> <Button systemImage="plus" label="Add" onPress={() => console.log('Add')} /> <Button systemImage="star" label="Favorite" onPress={() => console.log('Favorite')} /> <Button systemImage="square.and.arrow.up" label="Share" onPress={() => console.log('Share')} /> </ControlGroup> <Button label="Other Action" onPress={() => console.log('Other')} /> </Menu> </Host> ); }
应用接口
🌐 API
import { ControlGroup } from '@expo/ui/swift-ui';
Component
Type: React.Element<ControlGroupProps>
ReactNodeThe control group's content.
Can contain Button, Toggle, Picker, or other interactive controls.
ReactNodeThe label for the control group. Can be a string for simple text labels,
or a Label component for custom label content. When omitted, the control group
has no label.
SFSymbols7_0An SF Symbol name to display alongside the label.
Only used when label is a string.