TouchableOpacity is not working in MapBoxGL - react-native

Question

I have used MapBoxGL in my expo ejected project. i want to use my custom component at map PointAnnonation.
I have added custom icon too. But what i want is to navigate on touch of that i cont to different screen. So i wrapped whole MapboxGL.PointAnnotation 's child in TouchaleOpacity but it does not work while tapping on it.
<MapboxGL.MapView
style={styles.map}
logoEnabled={false}
localizeLabels={true}
>
<MapboxGL.Camera
zoomLevel={15}
animationMode={'flyTo'}
animationDuration={1100}
centerCoordinate={[73.20812, 22.29941]}
/>
<View>
<MapboxGL.PointAnnotation coordinate={[73.20812, 22.29941]}>
<TouchableOpacity onPress={() => Alert.alert('hello')}>
<Entypo
name='location-pin'
size={50}
color='black'
onPress={() => Alert.alert('h')}
/>
</TouchableOpacity>
</MapboxGL.PointAnnotation>
</View>
</MapboxGL.MapView>
Dependencies :
"#react-native-mapbox-gl/maps": "^8.1.0-rc.9",
"react-native": "~0.62.2",

Answer 1

I also faced this issue. TouchableOpacity doesn't work with MapboxGL.PointAnnotation, but it works with MapboxGL.MarkerView.
For handle click in PointAnnotation you can try to use onSelected prop. Such as I do here:
<MapboxGL.PointAnnotation
id={uuid4()}
onSelected={handleClick}
key={name}
coordinate={[longitude, latitude]}>
<TouchableOpacity>
<EntypoIcon name="location-pin" color="red" size={40} />
</TouchableOpacity>
</MapboxGL.PointAnnotation>
It will work with some delay and without opacity animation.