Reputation: 11
I am having trouble with the onPress handler in a marker component. onPress never seems to get called because it never calls onMarkerPress
which prints out something to the console. Does anyone have this issue?
Here is my code:
const AnimatedTouchable = Animated.createAnimatedComponent(TouchableOpacity);
{filteredMarkers.map((marker, index) => {
const scaleStyle={
transform: [
{
scale: interpolations[index].scale,
}
]
}
return (
<View style={styles.container}>
<MapView
ref={_map}
initialRegion={state.region}
provider={PROVIDER_GOOGLE}>
<Marker key={index} coordinate={marker.coordinate}>
<AnimatedTouchable style={[styles.markerWrap]} onPress={(e) => console.log(onMarkerPress(e))}>
<Animated.Image
source={require('../assets/map-marker.png')}
style={[styles.marker, scaleStyle]}
resizeMode="cover"
/>
</AnimatedTouchable>
</Marker>
</MapView>
</View>
);
})}
onMarkerPress:
const onMarkerPress = (mapEventData : any) => {
{console.log("PRESSED")}
const markerID = mapEventData._targetInst.return.key;
let x = (markerID * CARD_WIDTH) + (markerID * 20);
x = x - SPACING_FOR_CARD_INSET;
_scrollView.current.scrollTo({x: x, y: 0, animated: true});
}
Upvotes: 1
Views: 1044