Package Exports

react-native-wheely

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-native-wheely) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

react-native-wheely

An all JavaScript, highly customizable wheel picker for react native.

drawing drawing drawing drawing drawing drawing

Installation

Install with npm

npm install --save react-native-wheely

Install with yarn

yarn add react-native-wheely

Usage

import React, { useState } from 'react';
import WheelPicker from 'react-native-wheely';

function CityPicker() {
  const [selected, setSelected] = useState('Berlin');
  
  return (
    <WheelPicker 
      options={['Berlin', 'London', 'Amsterdam']}
      selected={selected}
      onChange={(city) => setSelected(city)}
    />
  );
}

Props

Name	Type	Description
options	any[]	Options to be displayed be the wheel picker.
selected	any	Currently selected option.
onChange	(selected: any) => void	Handler that is called when the selected option changes.
visibleRest	number	Amount of additional options that are visible in each direction. Default is 2, resulting in 5 visible options.
itemHeight	number	Height of each option in the picker. Default is 40.
itemStyle	StyleProp<ViewStyle>	Style for the option's container.
itemTextStyle	StyleProp<TextStyle>	Style for the option's text.
containerStyle	StyleProp<ViewStyle>	Style of the picker.
selectedIndicatorStyle	StyleProp<ViewStyle>	Style of overlaying selected-indicator in the middle of the picker.
rotationFunction	(x: number) => number	Function to determine the x rotation of items based on their current distance to the center (which is x). Default is $rotation equation$
opacityFunction	(x: number) => number	Function to determine the opacity of items based on their current distance to the center (which is x). Default is $opacity equation$
decelerationRate	"normal", "fast", number	How quickly the underlying scroll view decelerates after the user lifts their finger. See the ScrollView docs. Default is "fast".
scrollEventThrottle	number	How often the scroll event will be fired while scrolling (as a time interval in ms). Impacts tradeof between scroll performance and tracking accuracy. See the ScrollView docs. Default is 1.