react-native-multiple-choice-picker

A cross-platform (iOS / Android) multiple-choice component for React Native.

Getting Started

Installing

npm i react-native-multiple-choice-picker

Or

yarn add npm i react-native-multiple-choice-picker

Basic Usage

<MultipleChoice
  choices={['Football', 'Soccer']}/>

<MultipleChoice
  direction={'column'}
  choices={['Football', 'Badminton', 'Basketball', 'Tennis']}/>

<MultipleChoice
  renderCustomItem={() => {
    return <Text style={{ color: 'red', fontWeight: 'bold' }}>Basketball</Text>
  }}
  chosenColor={'red'}
  chosenTextColor={'black'}
  customIndex={0}
  direction={'column'}
  choices={['Football', 'Badminton', 'Basketball', 'Tennis']}/>

Props

Name	Description	Details
choices	Labels of multiple choice component	required array: []
chosenIndex	Currently chosen index	number: 0
onPress	Event handler when clicking at a choice	function: () => {}
style	Style of container	object: {}
direction	Multiple choice can be render in row or column direction	string: 'row' / 'column'
chosenColor	Color of the chosen component	string: '#e2641e'
chosenTextColor	Color of the chosen label	string: '#e2641e'
TouchableComponent	Custom choosing compoenent	component: DefaultTouchableComponent
outerRound	Dimension of outer round of the choosing component	number: 24
innerRound	Demision of inner round of the choosing component	number: 16.8
renderCustomItem	Render custom label component	function: () => {}
customIndex	Index to render custom label component	number: -1