|
| 1 | +# react-native-picker-checkbox |
| 2 | + |
| 3 | +A simple picker component with checkbox list for React-Native. |
| 4 | + |
| 5 | +### Example |
| 6 | +```sh |
| 7 | +$ cd example |
| 8 | +$ npm i |
| 9 | +$ react-native run-ios // For ios |
| 10 | +$ react-native run-android // For Android |
| 11 | +``` |
| 12 | + |
| 13 | +### Installation |
| 14 | +``npm install react-native-picker-checkbox --save`` |
| 15 | + |
| 16 | +### Usage |
| 17 | +```javascript |
| 18 | + import PickerCheckBox from 'react-native-picker-checkbox'; |
| 19 | + |
| 20 | + handleConfirm(pItems){ |
| 21 | + console.log('pItems =>', pItems); |
| 22 | + } |
| 23 | + |
| 24 | + const items = [ |
| 25 | + { |
| 26 | + itemKey:1, |
| 27 | + itemDescription:'Item 1' |
| 28 | + }, |
| 29 | + { |
| 30 | + itemKey:2, |
| 31 | + itemDescription:'Item 2' |
| 32 | + }, |
| 33 | + { |
| 34 | + itemKey:3, |
| 35 | + itemDescription:'Item 3' |
| 36 | + } |
| 37 | + ]; |
| 38 | + |
| 39 | + render() { |
| 40 | + return( |
| 41 | + <RoundPickerCheckBox |
| 42 | + data={items} |
| 43 | + headerComponent={<Text style={{fontSize:25}} >items</Text>} |
| 44 | + OnConfirm={(pItems) => this.handleConfirm(pItems)} |
| 45 | + ButtonTitleConfirm='OK' |
| 46 | + DescriptionField='itemDescription' |
| 47 | + KeyField='itemKey' |
| 48 | + placeholder='select some items' |
| 49 | + arrowColor='#FFD740' |
| 50 | + arrowSize={10} |
| 51 | + /> |
| 52 | + ) |
| 53 | + } |
| 54 | +``` |
| 55 | + |
| 56 | +### Properties |
| 57 | + |
| 58 | +| Name | Type | Description | Default | Optional |
| 59 | +| ------------ | ------------- | ------------ |------------ |------------ | |
| 60 | +| `data` | array | Json with id and description | null | false |
| 61 | +| ```headerComponent``` | component | Header component | null | true |
| 62 | +| ```ButtonTitleConfirm``` | String | confirm button's title | confirm | true |
| 63 | +| ```DescriptionField``` | string | Description Field of data object | null | false |
| 64 | +| ```KeyField``` | string | key Field | null | false |
| 65 | +| `placeholder` | string | The string that will be rendered before items has been selected | null | true |
| 66 | +| ```containerStyle``` | object | picker container style | null | true |
| 67 | +| ```arrowColor``` | string | Arrow Color | #000 | true |
| 68 | +| ```arrowSize``` | number | Arrow Size | 8 | true |
| 69 | + |
| 70 | + |
| 71 | +### Contributing |
| 72 | + |
| 73 | +If you'd like to see something added or changed to this module please open a new GitHub issue. Pull requests are always welcome. |
| 74 | + |
| 75 | +### License |
| 76 | + |
| 77 | + - [Apache-2.0](https://github.com/ViniciusWovst/react-native-picker-checkbox/blob/master/LICENSE). Vinícius Wovst |
| 78 | +# react-native-picker-checkbox |
0 commit comments