Estoy tratando de diseñar un componente deslizante en React Native con el siguiente código (ejemplo mínimo):

 import React from 'react' import {GestureResponderEvent, View} from 'react-native' const Slider = (): JSX.Element => { const [value, setValue] = React.useState() const onTouch = React.useCallback( (e: GestureResponderEvent) => setValue(e.nativeEvent.locationX), [setValue], ) return ( <View key="base" style={{flex: 1, flexDirection: 'row'}} onTouchStart={onTouch} onTouchMove={onTouch}> <View key="track" style={{width: value, backgroundColor: 'white'}}/> <View key="toggle" style={{width: 16, height: 16, borderRadius: 16 / 2, backgroundColor: 'red'}}/> </View> ) }

Tengo problemas porque el siguiente código funciona bien si toco la vista de track , pero no si toco la vista toggle .

Esto parece deberse al hecho de que e.nativeEvent.locationX es un número relativo dentro de la vista de toggle , no la vista base .

¿Alguna sugerencia?

EDITAR: puedo obtener la posición absoluta de los eventos táctiles usando las propiedades e.nativeEvent.pageX y e.nativeEvent.pageY , pero ¿cómo puedo obtener la posición absoluta de la vista base ? La devolución de llamada onLayout solo me da la relativa ...