react-native-slider icon indicating copy to clipboard operation
react-native-slider copied to clipboard

Does not support RTL

Open Yasser-Belatreche opened this issue 2 years ago • 3 comments

Yasser-Belatreche avatar Aug 01 '22 15:08 Yasser-Belatreche

I just found this too.

The Slider will always return to minVal and not stay where released but the Text does as the value is dispatched in handleChange

The deprecated RN Slider works with RTK.

Combing the basic RTK 'message' and Slider examples:

    const dispatch = useDispatch();
    const { message } = useSelector((state) => state.message);

    const handleChange = (value) => {
        dispatch(setMessage(value));
    };


...

<Slider value="0"  onValueChange={handleChange}  />
<Text style={styles.text}>{message}</Text>

WayneKeenan avatar Nov 28 '22 21:11 WayneKeenan

I don't have any plans to add RTL support personally, but I'd be open to reviewing a PR if anyone created one.

miblanchard avatar Dec 28 '22 17:12 miblanchard

    <MySlider
        trackStyle={style.track}
        thumbStyle={{...style.thumb, borderColor: renderThumbColor()}}
        maximumTrackTintColor={renderColor()}
        minimumTrackTintColor={colors.backgroundColors.background}
        thumbTintColor={colors.backgroundColors.surface}
        maximumValue={maximumValue}
        minimumValue={minimumValue}
        animateTransitions
        onValueChange={value => setValue(value)}
        minimumValue={1301}
        maximumValue={1402}
        values={[1304]}
        step={1}
        onSlidingComplete={value => console.log(value)}
        value={value}
        renderAboveThumbComponent={index => (
            <View
                style={[
                    style.baloon,
                    {
                        backgroundColor: renderAboveThumbComponentColor(),
                    },
                ]}>
                <Text
                    text={Math.abs(
                        maximumValue - value[index] + minimumValue
                    )}
                    // text={value[index]}
                    fullSize={false}
                    paddingHorzontalRatio={3}
                    color={renderBaloonTextColor()}
                    ratio={0}
                    typogeraphy={bodyFontStyles.medium12}
                />
            </View>
        )}
        {...rest}
    />

alireza847-programmer avatar Jan 02 '23 08:01 alireza847-programmer