react-native-draggable-switch
    TypeScript icon, indicating that this package has built-in type declarations

    1.1.1 • Public • Published

    npm version Build Status Greenkeeper Badge Coverage Status Codacy Badge

    React Native Draggable Switch

    A stateless, JS-only, animated, draggable switch component that maintains itself at 60fps.

    Demo

    GIF 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

    Install

    npm i react-native-draggable-switch

    DownloadsWeekly Downloads

    30

    Version

    1.1.1

    License

    MIT

    Unpacked Size

    27.5 kB

    Total Files

    13

    Last publish

    Collaborators

    • thousight