react-animated-checkbox

A React component for animated checkbox

Demo

Installation

npm install --save react-animated-checkbox

Usage

import CheckBox from "react-animated-checkbox"
...
<CheckBox
  checked={this.state.checked}
  checkBoxStyle={{
    checkedColor: "#34b93d",
    size: 100,
    unCheckedColor: "#b8b8b8"
  }}
  duration={400}
  onClick={()=>this.handleClick()}
/>

A more detailed example can be found here.

Props

| Property | Type | Explanation | |---|---|---| |checked|boolean|the checkbox animates when this property changes from false to true| |checkBoxStyle.checkedColor|string|checkbox color when property checked is true| |checkBoxStyle.unCheckedColor|string|checkbox color when property checked is false| |checkBoxStyle.size|number|checkbox size in pixels| |duration|number|animation duration in ms |onClick|function|this function is called when the checkbox is clicked