react-native-wheel-scrollview-picker

A pure js picker for React Native

• Original repository by @veizz: react-native-picker-scrollview.
• Fork by @yasemincidem who added the real cross platform behavior and datepicker react-native-wheel-scroll-picker.
• This is the third fork of repository, since it seems that @yasemincidem is no longer supporting react-native-wheel-scroll-picker.

---

Table of Contents

1. Features
2. Installation
3. Usage
   • Example
4. Props
5. License

Installation

yarn add react-native-wheel-scrollview-picker
# or
npm install react-native-wheel-scrollview-picker --save

Usage

import React, { Component } from "react";
import ScrollPicker from "react-native-wheel-scroll-picker";

export default class SimpleExample extends Component {
  render() {
    return (
      <ScrollPicker
        dataSource={["1", "2", "3", "4", "5", "6"]}
        selectedIndex={1}
        renderItem={(data, index) => {
          //
        }}
        onValueChange={(data, selectedIndex) => {
          //
        }}
        wrapperHeight={180}
        wrapperWidth={150}
        wrapperBackground={"#FFFFFF"}
        itemHeight={60}
        highlightColor={"#d8d8d8"}
        highlightBorderWidth={2}
      />
    );
  }
}

Props

Props	Description	Type	Default
dataSource	Data of the picker	Array
selectedIndex	selected index of the item	number	1
wrapperHeight	height of the picker	number
wrapperWidth	width of the picker	number
wrapperBackground	picker background	string	'#FFF'
itemHeight	height of eacch item	number
highlightColor	color of the indicator line	number	1
highlightBorderWidth	width of the indicator	string	"#d8d8d8"
activeItemTextStyle	Active Item Text object style	object
itemTextStyle	Item Text object style	object

Author

• Richard Heng

License

MIT