Passing an array of values about react-native-slider HOT 10 OPEN

Very preliminary way to wrap Slider to enable this:

  const renderSlider = (optionsArray, initialValue, onSlidingComplete) => (
    <Slider
      minimumValue={0}
      maximumValue={optionsArray.length - 1}
      step={1}
      value={optionsArray.indexOf(initialValue)}
      onSlidingComplete={(value) => onSlidingComplete(optionsArray[value])}
    />
  );

from react-native-slider.

Until this is formally supported, here's a workaround that worked well for my use case:

Slider component...

<Slider
  style={{width: '100%', height: 40}}
  step={0}
  minimumValue={5}
  maximumValue={60}
  onValueChange={(value) => {this.sliderValueChange(value)}}
/>

And the sliderValueChange function...

sliderValueChange = (value) => {
  // Array of desired values
  const array = [5, 10, 15, 30, 45, 60]

  const output = array.reduce((prev, curr) => Math.abs(curr - value) < Math.abs(prev - value) ? curr : prev)

  console.log(output)
  // ... Pass output to UI, state, whatever
}

from react-native-slider.

Hey @hery! Indeed it sounds interesting, please send a PR, and I'll be glad to ship it :)

from react-native-slider.

Good to hear thanks! iOS is ready but I'm a bit slower with Android. Quick question, should I remove androidx from my implementation?

from react-native-slider.

Hi @hery ,
I was looking for a slider component exactly like you mentioned.
Here is a use case.
I am trying to make a small utility for ER doctors to determine very quickly the amount of a medicine which stops heavy bleedings.
And there is a slider i need there which has the values like 2.0 - 2.1 - 2.3 - 2.8 - 3.1 - 3.3 - 3.7 and so, without a contstant amount of increments.

When do you think this feature will be implemented?

Thank you very much.

from react-native-slider.

Hi @orkunsenturk, it's ready on iOS but I'm still figuring out a few things on Android.

The logic is a bit different on Android so my implementation is a little buggy, but I'll try to fix it soon.

from react-native-slider.

Is anyone working on this? I would like to collaborate.

from react-native-slider.

@a-c-sreedhar-reddy please do!

from react-native-slider.

Hi guys! Where is the code of android which takes care of steps when dragging so that UI does not change until you reach a step?

from react-native-slider.

I'm posting here some examples and thoughts of @gkupsaw given in the duplicate issue:

I'm not sure if this is already exists, but it would be nice to have the option to use discrete values for the slider instead of continuous options.
It would probably be easiest to emulate the code of existing discrete slider implementations on the web. I haven't thought too deeply about the implementation yet, but would gladly look into it if it's something to be added.

Related Issues

An example of this kind of slider: https://material-ui.com/components/slider/#discrete-sliders
(Unmanaged) implementation in RN: https://www.npmjs.com/package/react-native-snap-slider

from react-native-slider.