react-native-segmentedControl

react-native-segmentedControl for( Android / Ios )

Overview

SegmentedControl using react-native,support android and ios.
Pages won't be rendered when you switch to other tabs,also save the status of invisible pages.

Installation

First you need to install react-native-segmented-control:

``javascript
npm install react-native-segmented-control --save
`

Props

$3

| prop | value | required/optional | comment |
| --- | --- | --- | --- |
| defaultPage | number | optional | default:0 |
| itemFontSize | number | optional | text fontsize default:14 |
| itemButtonActiveColor | color | optional | ActiveButton color |
| itemButtonColor | color | optional | defaultButton color |
| itemTextActiveColor | color | optional | ActiveText color |
| itemTextColor | color | optional | defaultText color |
| itemButtonViewStyle | style | optional | button container style |
| itemButtonBorderColor | color | optional | button border color |
| itemHeaderViewStyle | style | optional | header container style |




$3

| prop | value | required/optional | comment |
| --- | --- | --- | --- |
| title | string | required | title of item |
| onPress | function | optional | the function will be called when item is selected. |




Usage

`javascript
import SegmentedControl from 'react-native-segmented-control';

defaultPage={1}
itemButtonViewStyle = {{
width:200
}}
itemHeaderViewStyle = {{
paddingVertical:10,
}}
ref = {e=>this.SegmentedControl=e}
>
title = {'直播'}
>
page0

title = {'点播'}
>
page1

title = {'影音'}
>
page2



`

###Methods
* update(number) - select item.
`javascript
this.SegmentedControl.update(number)
``

Screenshot