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

Picker

A Jetpack Compose Picker component for selecting options from a list.

Android

A picker component that allows users to select from a list of options with different display styles.

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.

Radio picker

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

<Picker
  options={['$', '$$', '$$$', '$$$$']}
  selectedIndex={selectedIndex}
  onOptionSelected={({ nativeEvent: { index } }) => {
    setSelectedIndex(index);
  }}
  variant="radio"
/>

See official Jetpack Compose documentation for more information.

Segmented picker

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

<Picker
  options={['$', '$$', '$$$', '$$$$']}
  selectedIndex={selectedIndex}
  onOptionSelected={({ nativeEvent: { index } }) => {
    setSelectedIndex(index);
  }}
  variant="segmented"
/>

See official Jetpack Compose documentation for more information.

API

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

No API data file found, sorry!