Skip to main content
Version: 4.0.0-rc.3

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.

<Tab.Item
title="Tab 1"
buttonStyle={(active) => {
backgroundColor: active ? "red" : "blue";
}}
/>

Import

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

Usage

Props

note

Includes all View props.

NameTypeDefaultDescription
containerStyleView StyleStyle for Tab container
disableIndicatorbooleanDisable the indicator below.
indicatorStyleView StyleAdditional styling for tab indicator.
onChange(value: number) => voidFunctionOn Index Change Callback.
scrollablebooleanfalseMakes Tab Scrolling
valuenumberChild position index value.
variantprimary or defaultDefine the background Variant.

Playground

Loading...