排

用于水平排列子组件的 Jetpack Compose Row 组件。

Android

Bundled version:

~55.0.2

Expo UI Row 与官方 Jetpack Compose Row API 相匹配，并以可配置的排列和对齐方式水平放置子元素。

🌐 Expo UI Row matches the official Jetpack Compose Row API and places children horizontally with configurable arrangement and alignment.

安装

🌐 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

Row 将儿童水平排列。使用 horizontalArrangement 和 verticalAlignment 来控制间距和对齐。

RowExample.tsx

import { Host, Row, Text } from '@expo/ui/jetpack-compose';
import { fillMaxWidth, height } from '@expo/ui/jetpack-compose/modifiers';

export default function RowExample() {
  return (
    <Host matchContents>
      <Row
        horizontalArrangement="spaceEvenly"
        verticalAlignment="center"
        modifiers={[fillMaxWidth(), height(60)]}>
        <Text>Item 1</Text>
        <Text>Item 2</Text>
        <Text>Item 3</Text>
      </Row>
    </Host>
  );
}

应用接口

🌐 API

import { Row } from '@expo/ui/jetpack-compose';

Component

`Row`

Android

Type: React.Element<RowProps>

RowProps

`children`

Android

Optional • Type: React.ReactNode

`horizontalAlignment`

Android

Optional • Type: HorizontalAlignment

Horizontal alignment of children.

`horizontalArrangement`

Android

Optional • Type: HorizontalArrangement

Horizontal arrangement of children.

`verticalAlignment`

Android

Optional • Type: VerticalAlignment

Vertical alignment of children.

`verticalArrangement`

Android

Optional • Type: VerticalArrangement

Vertical arrangement of children.

Inherited Props

PrimitiveBaseProps