react-native-scrollable-tab-menu

react-native-scrollable-tab-menu

A variation of 'react-native-scrollable-tab-view' with a menu interface.

##Installation with yarn:

yarn add react-native-scrollable-tab-view
yarn add react-native-linear-gradient
react-native link

With npm:

npm install --save react-native-scrollable-tab-view
npm install --save react-native-linear-gradient
react-native link

##Simple Usage

import ScrollableTabMenu from 'react-native-scrollable-tab-menu'
...
render() {
  return (
    <ScrollableTabMenu>
      <Component1 title={"Rook"}/>
      <Component2 title={"Bishop"}/>
      <Component3 title={"Queen}/>
      <Component4 title={"King"}/>
      <Component5 title={"Pawn"}/>
    </ScrollableTabMenu>
  )
}
...

##Usage With Custom Props

import ScrollableTabMenu from 'react-native-scrollable-tab-menu'
...
render() {
  return (
    <ScrollableTabMenu
      locations={[0.0, 0.5, 1.0]}
      colors={["transparent", "white", "blue"]}  tabColor="red"
      backgroundImage={require('../images/myImage1.png')}
      menuBackgroundColor={Scheme.white(1.0)}
      menuImage={require('../images/myImage2.png')}
      menuFontStyle={{color: "red", fontSize: 20}}
      tabColor={"gray"}
    >
      <Component1 title={"Basketball"}/>
      <Component2 title={"Baseball"}/>
      <Component3 title={"Hockey}/>
      <Component4 title={"Football"}/>
      <Component5 title={"Soccer"}/>
    </ScrollableTabMenu>
  )
}
...

##PropTypes menuImage PropTypes.any
backgroundImage PropTypes.any
tabColor PropTypes.string
menuFontStyle Text.propTypes.style
menuContainerStyle View.propTypes.style
menuGradientlocations PropTypes.array
menuGradientColors PropTypes.array
blendDuration React.PropTypes.number
isAnimated React.PropTypes.bool