Home

Awesome

<h1 align="center"> <p align="center"> <img src="https://github.com/Ramotion/fluid-slider/raw/master/fluid-slider.gif"/> </p> <p align="center"> <a href="https://www.npmjs.com/package/react-native-fluidic-slider"><img src="http://img.shields.io/npm/v/react-native-fluidic-slider.svg?style=flat" /></a> <a href="https://github.com/prscX/react-native-fluidic-slider/pulls"><img alt="PRs Welcome" src="https://img.shields.io/badge/PRs-welcome-brightgreen.svg" /></a> <a href="https://github.com/prscX/react-native-fluidic-slider#License"><img src="https://img.shields.io/npm/l/react-native-fluidic-slider.svg?style=flat" /></a> </p>
ReactNative: Native Fluidic Slider (Android/iOS): Deprecated

Due to time constraint, this library is deprecated and not maintained anymore, You can still use this library.

If this project has helped you out, please support us with a star 🌟

</h1> This library is a React Native bridge around native fluid slider libraries. It allows you select value from a range of values:

📖 Getting started

$ npm install react-native-fluidic-slider --save

$ react-native link react-native-fluidic-slider

buildscript {
    repositories {
        google()
        maven { url "https://maven.google.com" }
        jcenter()
        ...
    }
}

allprojects {
    repositories {
        google()
        mavenLocal()
        maven { url 'https://jitpack.io' }
        maven {
            url 'https://maven.google.com/'
            name 'Google'
        }
        jcenter()
        ...
    }
}

Note: Android SDK 27 > is supported

💻 Usage

import { RNFluidicSlider } from 'react-native-fluidic-slider'

<RNFluidicSlider></RNFluidicSlider>

💡 Props

PropTypeDefaultNote
minnumber0Specify min range value of the slider
maxnumber100Specify max range value of the slider
initialPositionnumber - 0 to 1.5Specify initial position of slider indicator
barColorstring: HEX_COLOR#6168e7Specify bar color
bubbleColorstring: HEX_COLOR#FFFFFFSpecify bubble color
barTextColorstring: HEX_COLOR#FFFFFFSpecify bar text color
bubbleTextColorstring: HEX_COLOR#000000Specify bubble text color
beginTrackingfunc (position)Specify callback function for begin tracking
endTrackingfunc (position)Specify callback function for end tracking

Note:

✨ Credits

🤔 How to contribute

Have an idea? Found a bug? Please raise to ISSUES. Contributions are welcome and are greatly appreciated! Every little bit helps, and credit will always be given.

💫 Where is this library used?

If you are using this library in one of your projects, add it in this list below. ✨

📜 License

This library is provided under the Apache 2 License.

RNFluidicSlider @ prscX

💖 Support my projects

I open-source almost everything I can, and I try to reply everyone needing help using these projects. Obviously, this takes time. You can integrate and use these projects in your applications for free! You can even change the source code and redistribute (even resell it).

However, if you get some profit from this or just want to encourage me to continue creating stuff, there are few ways you can do it: