react-native-picker-android
PickerAndroid has PickerIOS interface in pure javascript
Warn
if 0.14.2 <= react-native <=0.24 npm install react-native-picker-android@0.3.8 --save
if 0.24 < react-native npm install react-native-picker-android --save
Documentation
Props
- pickerStyle viewStylePropType
- itemStyle textStylePropType
- selectedValue any
- onValueChange function
Methods
- moveUp when called, the wheel will go up, which will trigger onValueChange
- moveDown when called, the wheel will go down, which will trigger onValueChange too.
Usage
Step 1 - install
npm install react-native-picker-android --save
Step 2 - import and use in project
'use strict'; ; ; let Picker = PlatformOS === 'ios' ? PickerIOS : PickerAndroid;let PickerItem = PickerItem; let CAR_MAKES_AND_MODELS = amc: name: 'AMC' models: 'AMX' 'Concord' 'Eagle' 'Gremlin' 'Matador' 'Pacer' alfa: name: 'Alfa-Romeo' models: '159' '4C' 'Alfasud' 'Brera' 'GTV6' 'Giulia' 'MiTo' 'Spider' aston: name: 'Aston Martin' models: 'DB5' 'DB9' 'DBS' 'Rapide' 'Vanquish' 'Vantage' audi: name: 'Audi' models: '90' '4000' '5000' 'A3' 'A4' 'A5' 'A6' 'A7' 'A8' 'Q5' 'Q7' austin: name: 'Austin' models: 'America' 'Maestro' 'Maxi' 'Mini' 'Montego' 'Princess' borgward: name: 'Borgward' models: 'Hansa' 'Isabella' 'P100' buick: name: 'Buick' models: 'Electra' 'LaCrosse' 'LeSabre' 'Park Avenue' 'Regal' 'Roadmaster' 'Skylark' cadillac: name: 'Cadillac' models: 'Catera' 'Cimarron' 'Eldorado' 'Fleetwood' 'Sedan de Ville' chevrolet: name: 'Chevrolet' models: 'Astro' 'Aveo' 'Bel Air' 'Captiva' 'Cavalier' 'Chevelle' 'Corvair' 'Corvette' 'Cruze' 'Nova' 'SS' 'Vega' 'Volt' ; Component { superprops context; thisstate = carMake: 'cadillac' modelIndex: 3 } { let make = CAR_MAKES_AND_MODELSthisstatecarMake; let selectionString = makename + ' ' + makemodelsthisstatemodelIndex; return <View> <Text>Please choose a make for your car:</Text> <Picker selectedValue=thisstatecarMake onValueChange= this> Object </Picker> <Text>Please choose a model of makename:</Text> <Picker selectedValue=thisstatemodelIndex key=thisstatecarMake onValueChange= this> CAR_MAKES_AND_MODELSthisstatecarMakemodels </Picker> <Text>You selected: selectionString</Text> </View> ; };