Slider hovers to the right side of my finger

[jakeorbtl]

Currently, the slider thumb hovers slightly to the right of the actual position of the user's finger on the screen. This behavior makes it so that sliders which touch the left side of a screen are impossible to set to their minimum value by manually sliding.

I tried to workaround this by mapping the value received by onValueChanged to the full range of the slider and setting the slider value to the new mapped value, which worked but lead to flickering since the slider is not a controlled component.

If the slider were a controlled component that would solve my issue, but if that is impossible, or if there is a reason that it shouldn't be controlled, would there be a way to interpolate my finger drag to a wider range? It would be similar to adjusting scrub speed on a video player seekbar.

[miblanchard]

Can you provide a repro example of this issue please?

[justintoth]

@jakeorbtl Were you able to solve the issue? I'm running into the same, using the following code:

<Slider
        minimumValue={0}
        maximumValue={maximumValue}
        step={0}
        trackClickable={true}
        value={currentTime}
        style={[styles.slider, !isFullScreen && sliderStyle]}
        trackStyle={styles.track}
        thumbStyle={styles.thumb}
        minimumTrackTintColor={errorToastIcon}
        thumbTouchSize={styles.thumbTouch}
        onSlidingStart={() => onSeekStart()}
        onValueChange={value => onSeekChange(value)}
        onSlidingComplete={value => onSeekComplete(value)}
      />

[EduardoArtioli]

same here when using

thumbTouchSize={{ width: normalizeWidth(40), height: normalizeHeight(40) }}