Thumb placement problem with double thumb, big values and small step

[BadLice]

Hello!

I am rendering a slider with two thumbs, a big range of values (from 0 to 305) and a step of 1. I am facing an problem when sliding the max value thumb to the left: when the max value thumb is near the min value thumb, it stops slinding left, but keeping sliding the actual value and the track correctly slide.

this is the point where the thumb stops sliding

here im keeping sliding, as you can see the thumb is locked to the previous position, but the track di actually slide left a bit, and the value decreased

here i slided as much as possible to the left, so that the actual max value is 1, so the track is 1px wide, but the thumb is still locked

here the code:

      <Slider
        containerStyle={{ marginHorizontal: 10 }}
        disabled={rest.minimumValue === rest.maximumValue || rest.disabled}
        thumbStyle={styles.thumb}
        trackStyle={styles.rail}
        minimumTrackTintColor={platform.brandPrimary}
        maximumTrackTintColor={platform.brandPrimary}
        renderAboveThumbComponent={handleRenderAboveThumbComponent}
        onSlidingComplete={handleOnSlidingComplete}
        animationType="spring"
        minimumValue={rest.minimumValue ?? 0}
        maximumValue={rest.maximumValue ?? 0}
        step={1}
        value={[priceLow, priceHigh]}
        onValueChange={updateRanges}
        renderAboveThumbComponent={renderAboveThumbComponent}
        minLabel={`€${rest.minimumValue ?? 0}`}
        maxLabel={`€${rest.maximumValue ?? 0}`}
      />

[patrickacioli]

For me, a similar occurs when I forgot to put value in array of deps of onValueChange, in your example, check if priceLow and priceHigh are deps of updateRanges

[BadLice]

unfortunately, adding them to the dependency array, did not solve the issue

[patrickacioli]

You're right. Maybe we can fix that. I'll check if I can produce an PR.