Tab

Tabs organize content across different screens, data sets, and other interactions.

note

This component is not for (complex) navigation. Use React Navigation for that.

Usage

Import

import { Tab } from '@rneui/themed';

Theme Key

Tab

Basic Tabs

Loading...

Active Tab Items

Loading...

Props

note

Includes all View props.

Name	Type	Default	Description
buttonStyle	ViewStyle or (active: boolean) => ViewStyle	none	Additional button style
containerStyle	ViewStyle or (active: boolean) => ViewStyle	none	Additional Styling for button container.
dense	boolean	none	Dense Tab Item
disableIndicator	boolean		Disable the indicator below.
iconPosition	left | right | top | bottom	none
indicatorStyle	View Style		Additional styling for tab indicator.
onChange	(value: number) => void	Function	On Index Change Callback.
scrollable	boolean	false	Makes Tab Scrolling
titleStyle	TextStyle or (active: boolean) => TextStyle	none	Additional button title style
value	number	0	Child position index value.
variant	primary | default	default	Define the background Variant.

Playground

Loading...