Version: 3.0.0-next.36

ActionSheet

An Action Sheet is a dialog that displays a set of options. It appears on top of the app's content.

Import#

NativeBase exports 5 modal-related components:

  • Actionsheet: Provides the context and state for all components.
  • Actionsheet.Content: Wrapper for theĀ Actionsheet.Header and Actionsheet.ItemĀ components.
  • Actionsheet.Header: Provides a header to the list.
  • Actionsheet.Footer: A separated footer component for better customisation support. Wrapper for the Actionsheet.ItemĀ components.
  • Actionsheet.Item: A button to wrap the options of the Actionsheet.
import { Actionsheet } from 'native-base';

Examples#

Usage#

Composition#

DisableOverlay#

Props#

NameTypeDescriptionDefault
isOpenbooleanIf true, actionsheet will be open.-
onClosefunctionCallback when actionsheet is closed.-
disableOverlaybooleanIf true, disables the overlay.-

ActionSheet, Actionsheet.Content, Actionsheet.Header, Actionsheet.Footer implement Box, so all the Box Props can be passed to them.

Actionsheet.Item implements Button, all the props of Button can be passed here.