Slider thumb not aligning with mouse arrow
Environment
React Native using Expo.
"@react-native-community/slider": "4.5.6"
-
are you using the new architecture?
-
which version of react & react-native are you using? 19
Description
https://github.com/user-attachments/assets/df54b088-ade4-4194-a06b-aa7f1e0ba771
Reproducible Demo
const SliderSetting= ({settingName}: SliderSettingProps)=> {
const [value, setValue] = useState<number>(0.1);
return (
<View
style={{
display: 'flex',
flexDirection: 'row',
alignItems: 'center',
gap: 24,
// backgroundColor: '#0000ff70',
}}
>
<Text
style={{
fontFamily: 'doto_rounded-Black',
fontSize: 24,
// minWidth: 256,
}}
>{settingName}</Text>
<Slider
style={{
width: 512,
}}
minimumValue={0}
maximumValue={0.5}
step={0.05}
value={value}
onValueChange={setValue}
minimumTrackTintColor="black"
maximumTrackTintColor="yellow"
thumbTintColor="black"
></Slider>
<Text
style={{
fontFamily: 'doto_rounded-Black',
fontSize: 24,
minWidth: 256,
}}
>{value}</Text>
</View>
)
}
Hi thanks for reporting. Could you give more context ? Is this Expo for web related ? Im not sure what platform this is related to, therefore I cannot reproduce that. Tried running this example on latest expo SDK 53 and it seems to work fine in web.
I have the same issue and my case is due to the flex row layout. Is there any fix please?
I have the same issue and my case is due to the flex row layout. Is there any fix please?
I upgraded to 5.01 and fixed my issue.