This is documentation for the next SDK version. For up-to-date documentation, see the latest version (SDK 54).
A SwiftUI Section component for grouping related content in lists.
iOS
tvOS
A section component for grouping related content within lists, providing headers, footers, and collapsible functionality.
Installation
Terminal
-
npx expo install @expo/ui
If you are installing this in an existing React Native app, make sure to install expo
in your project.
Usage
import { Host, List, Section, Switch, Text } from '@expo/ui/swift-ui'; function SectionExample() { return ( <Host style={{ flex: 1 }}> <List> <Section header={<Text>Custom Header</Text>} footer={<Text color="gray">These settings control app behavior</Text>}> <Switch label="Enable notifications" value={true} /> <Switch label="Dark mode" value={false} /> </Section> </List> </Host> ); }
See Official SwiftUI documentation for more information.
API
Component
Type: React.Element<SectionProps>
Section component uses the native Section component. It has no intrinsic dimensions, so it needs explicit height or flex set to display content (like ScrollView).