Slider

A little (horizontal) animated slider component for React Native. Inspired by rn-vertical-slider.

Features

• Vanilla React Native animation API
• Compatible with Expo, try it out in the snack

Caveats

• This implementation of the pan gesture animation runs on the JS thread.

Installation

yarn add @candlefinance/slider

Usage

Check out the example project for a demo project.

import Slider from '@candlefinance/slider';

<Slider
  value={myValue}
  disabled={false}
  min={1}
  max={99}
  onChange={(value) => {
    console.log('CHANGE', value);
    setMyValue(value);
  }}
  onComplete={(value) => {
    console.log('COMPLETE', value);
  }}
  width={300}
  height={54}
  step={1}
  maximumTrackTintColor="#c7c7c7"
  minimumTrackTintColor="#ff0067"
  ballIndicatorColor="#4f4f4f"
  ballIndicatorTextColor="#ffffff"
/>

Contributing

See the contributing guide to learn how to contribute to the repository and the development workflow.

License

MIT