This documentation is available as Markdown for AI agents and LLMs. See the full Markdown index or append .md to any documentation URL.
Spacer
一个布局占位符，用于在兄弟元素之间产生空白。
一个布局间隔组件，用于在 Row 或 Column 内的兄弟元素之间创建空白空间。使用 size 设置固定间隙，或使用 flexible 填充剩余的主轴空间。
安装
- npx expo install @expo/uiIf you are installing this in an existing React Native app, make sure to install expo in your project.
用法
固定大小间隔
import { Host, Column, Text, Spacer } from '@expo/ui'; export default function FixedSpacerExample() { return ( <Host matchContents> <Column> <Text>顶部</Text> <Spacer size={32} /> <Text>底部</Text> </Column> </Host> ); }
可伸缩间隔
可伸缩间隔会沿其父级的主轴填充剩余空间，将周围内容推到两端。
import { Host, Row, Text, Spacer } from '@expo/ui'; export default function FlexibleSpacerExample() { return ( <Host style={{ flex: 1 }}> <Row> <Text>前导</Text> <Spacer flexible /> <Text>尾随</Text> </Row> </Host> ); }
API
import { Spacer } from '@expo/ui';
Component
Type: React.Element<SpacerProps>
A layout spacer that produces empty space between siblings in a
Row or Column.
Props for the Spacer component.
A Spacer produces empty space between siblings in a Row or
Column. Use size for a fixed amount of space, or flexible
to fill the remaining space along the parent's main axis.
booleanWhether the component is disabled. Disabled components do not respond to user interaction.
boolean • Default: falseWhen true, the spacer expands to fill the available space along the
parent's main axis, pushing sibling content to the opposite end.
ModifierConfig[]Platform-specific modifier escape hatch. Pass an array of modifier configs
from @expo/ui/swift-ui/modifiers or @expo/ui/jetpack-compose/modifiers.
() => voidCalled when the component is removed from screen.
numberFixed size in density-independent pixels. Interpreted as width in a horizontal container and as height in a vertical container.
Pick<ViewStyle, 'padding' | 'paddingHorizontal' | 'paddingVertical' | 'paddingTop' | 'paddingBottom' | 'paddingLeft' | 'paddingRight' | 'backgroundColor' | 'borderRadius' | 'borderWidth' | 'borderColor' | 'opacity' | 'width' | 'height'>Platform-agnostic style properties. These are translated to SwiftUI modifiers on iOS and Jetpack Compose modifiers on Android.