rn-wheel-picker

JavaScript implementation of the common wheel picker component, that doesn't rely on native components. Only native dependency we use is the <LinearGradient> component, that we use to mask the outer items.

Installation

• Run npm install rn-wheel-picker --save
• Manually link the LinearGradient as seen in https://github.com/react-native-community/react-native-linear-gradient

Usage

import { WheelPicker } from 'rn-wheel-picker'

Props

| Name | Description | Details | | ------------------ | ----------------------------------------------------------------------------------------------- | --------------------- | | options | Array of objects with one required property label | array | | onOptionSelected | callback function returning the selected item from the options array | function | | onCancel | callback function invoked on pressing the cancel button | function | | active | Controls the visibility of the picker window | boolean | | CancelButton | Optional cancel button component if you prefer using it over the standard buttons and callbacks | Component | | ConfirmButton | Optional confirmation button component | Component | | snapInterval | delay before snapping animation in ms | number | | optionHeight | Option height | number | | optionTextStyle | Overrides the option text style | object, number, array | | title | Optional title string | string | | caption | Optional caption string | string |

TODOS

• Add looping
• Add customizable number of options
• Open more parts of the component to custom style
• Add CocoaPods support / auto linking