1.1.1 • Published 6 years ago
react-native-draggable-switch v1.1.1
React Native Draggable Switch
A stateless, JS-only, animated, draggable switch component that maintains itself at 60fps.
Demo

Getting started
yarn add react-native-draggble-switch
Usage
...
import Switch from 'react-native-draggable-switch';
...
render() {
...
return (
<Switch
width={50}
height={30}
value={this.state.isSwitchOn}
onValueChange={(isSwitchOn) => this.setState({ isSwitchOn })}
/>
)
}
...Props Definitions
<Switch />
| Prop | Explanation | Type | Default | Required |
|---|---|---|---|---|
| width | The width of the switch | number | true | |
| height | The height of the switch | number | true | |
| value | The value of the switch, indicating if the switch is on or off | boolean | true | |
| onValueChange | The callback function for when the value is changed in Switch, providing the updated value in params | function | true | |
| disabled | If user touch is disabled | boolean | false | false |
| containerStyle | Style for Switch outer container | ViewStyle | null | false |
| circleStyle | Style for the dragging circle of the switch | ViewStyle | null | false |
| backgroundColor | Background color of the Switch when it is not on | string | '#F6F7FA' | false |
| circleColor | Color of the dragging circle | string | '#FFFFFF' | false |
| activeColor | Background color of the Switch when it is on | string | '#66D0B1' | false |
| disabledColor | Background color of the Switch when it is disabled | string | '#A1A1A1' | false |