A color picker component for react native
npm install react-native-color-picker-wheel
npm install react-native-color-picker-wheel
`
Usage
`js
import { Component } from 'react'
import { View, Text } from 'react-native'
import ColorPicker from 'react-native-color-picker-wheel'
class App extends Component {
render() {
return (
ref={r => { this.picker = r }}
color={this.state.currentColor}
swatchesOnly={this.state.swatchesOnly}
onColorChange={this.onColorChange}
onColorChangeComplete={this.onColorChangeComplete}
thumbSize={40}
sliderSize={40}
noSnap={true}
row={false}
swatchesLast={this.state.swatchesLast}
swatches={this.state.swatchesEnabled}
discrete={this.state.disc}
/>
this.picker.revert()} />
)
}
}
export default App
`
API
ColorPicker
Component props and default values
row: false use row or vertical layout
noSnap: false enables snapping on the center of wheel and edges of wheel and slider
thumbSize: 50 wheel color thumb size
sliderSize: 20 slider and slider color thumb size
discrete: false use swatchs of shades instead of slider
swatches: true show color swatches
swatchesLast: true if false swatches are shown before wheel
swatchesOnly: false show swatch only and hide wheel and slider
color: '#ffffff' color of the color picker
onColorChange: () => {} callback function for slider and wheel thumb movement
onColorChangeComplete: () => {} callback function for when the slider and wheel thumb stops moving
Instance methods
revert()` reverts the color to the one provided in the color prop