This is documentation for the next SDK version. For up-to-date documentation, see the latest version (SDK 54).

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

Installation

If you are installing this in an existing React Native app, make sure to install expo in your project.

Usage

Row places children horizontally. Use horizontalArrangement and verticalAlignment to control spacing and alignment.

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