npm.io
1.0.5 • Published 6 years ago

@tickid/react-native-tabs

Licence
ISC
Version
1.0.5
Deps
2
Size
9 kB
Vulns
0
Weekly
0
Stars
2

Demo

Installation

Yarn:

$ npm i @tickid/react-native-tabs --save

or NPM:

$ yarn add @tickid/react-native-tabs

Usage

Sample code to use this simple library:

import React, { Component } from 'react';
import { Text } from 'react-native';
import { Tabs, Tab } from '@tickid/react-native-tabs';

export default class TabsExample extends Component {
  render() {
    return (
      <Tabs>
        <Tab heading="Tab one">
          <Text>Content of #tabOne</Text>
        </Tab>

        <Tab heading="Tab two">
          <Text>Content of #tabTwo</Text>
        </Tab>

        <Tab heading="Tab three">
          <Text>Content of #tabThree</Text>
        </Tab>
      </Tabs>
    );
  }
}

Props:

<Tabs>

Property Type Default Description
tabIndex Number 0 The default tab index is active. (optional)
tabChangeDuration Number 100 Slider speed in milliseconds. (optional)
tabTitleStyle Style Style applied to tab title. (optional)
activeTabTitleStyle Style Style applied to active tab title. (optional)
tabContainerStyle Style Style applied to tab container. (optional)
activeTabContainerStyle Style Style applied to active tab container. (optional)
tabBodyStyle Style Style applied to tab body (Wrap ). (optional)
containerStyle Style Style applied to wrap of this library. (optional)
activeLineColor String #355587 Specifies the background color for active tab. (optional)
onChangeTab Function Called when the tab change. (optional)

<Tab>

Property Type Default Description
heading String The title of the tab. (required)
containerStyle Style Styles are applied individually to each tab. (optional)

Keywords