react-native-scroll-menu

React native scrolling button horizontal

Installation

npm i react-native-scroll-menu

yarn add react-native-scroll-menu

Example

| Example | | :-----------------------------------------------------------: | | | | |

Usage

import React, {Component} from 'react';
import {
    View
} from 'react-native';

//import this
import ScrollingButtonMenu from 'react-native-scroll-menu';


export default class Example extends Component
{

  render()
  {
    return (
        <ScrollingButtonMenu
            items={[
              {
                id: "1",
                name: 'Yaşam',
              },
              {
                id: "2",
                name: 'Zaman',
              },
              {
                id: "3",
                name: 'İnanç',
              },
              {
                id: "4",
                name: 'Cosmos',
              },
              {
                id: "5",
                name: 'Düşüş',
              },
            ]}
            onPress={(e) => {
              console.log(e);
            }}
            selected={"1"}
        />
    );
  }
}

//define menu
let menus = [
  {
    name: 'Sekiz',
    id: 1,
    backgroundColor: '#388E3C',
    borderColor: '#388E3C',
  },
  {
    text: 'Penguen',
    id: 2,
  }
];

Props

| Key | Type | Description | |-----------------------------|----------------|-------------------------------------------------------------| | items | Array | Array for button menu is required | | onPress | Function(menu) | Function when press button is required | | upperCase | Boolean | Uppercase text (optional) default value => false | | selectedOpacity | Number | Opacity when pressed button (optional) default value => 0.7 | | containerStyle | Object | {} | | contentContainerStyle | Object | {} | | scrollStyle | Object | {} | | textStyle | Object | {} | | buttonStyle | Object | {} | | activeButtonStyle | Object | {} | | firstButtonStyle | Object | {} | | lastButtonStyle | Object | {} | | textStyle | Object | {} | | activeTextStyle | Object | {} | | activeColor | string | "#fffff" | | activeBackgroundColor | string | "#fffff" | | selected | number | item id => 1 | | keyboardShouldPersistTaps | string | default => always |