Animated segment control for react native.
npm install --save react-native-animated-segment-control
yarn add react-native-animated-segment-control
import SegmentControl from 'react-native-animated-segment-control'; render() { return ( <View style={styles.mainContainer}> <SegmentControl values={['Segment1', 'Segment2', 'Segment3']} onChange={(currentIndex) => {}} disable={false} selectedIndex={1} /> </View> ) }
| Prop | Type | Description |
|---|---|---|
disable |
Boolean |
Enable / Disable the entire component. Default is false. |
values |
Array(String) |
The labels for the control's segment buttons, in order. |
onChange |
function |
Callback that is called when the user taps a segment. |
selectedIndex |
Number |
Index of the selected segment. |
offsetHeight |
Number |
Active Segment's offset height. |
style |
Styles |
Styles props of segment control. |
segmentControlStyle |
Styles |
Styles props of segment control. |
activeSegmentStyle |
Styles |
Styles props of active segment view. |
selectedTextStyle |
Styles |
Selected Segment's text style. |
unSelectedTextStyle |
Styles |
Unselected Segment's text style. |
MIT