diff --git a/docs/marker.md b/docs/marker.md index deb53f4..200ea2f 100644 --- a/docs/marker.md +++ b/docs/marker.md @@ -19,6 +19,7 @@ | `draggable` | `` | | This is a non-value based prop. Adding this allows the marker to be draggable (re-positioned). | `tracksViewChanges` | `Boolean` | true | Sets whether this marker should track view changes. It's recommended to turn it off whenever it's possible to improve custom marker performance. **Note**: iOS Google Maps only. | `tracksInfoWindowChanges` | `Boolean` | false | Sets whether this marker should track view changes in info window. Enabling it will let marker change content of info window after first render pass, but will lead to decreased performance, so it's recommended to disable it whenever you don't need it. **Note**: iOS Google Maps only. +| `stopPropagation` | `Boolean` | false | Sets whether this marker should propagate `onPress` events. Enabling it will stop the parent `MapView`'s `onPress` from being called. **Note**: iOS only. Android does not propagate `onPress` events. See [#1132](https://github.com/react-community/react-native-maps/issues/1132) for more information. ## Events diff --git a/index.d.ts b/index.d.ts index f68bd7e..605683c 100644 --- a/index.d.ts +++ b/index.d.ts @@ -146,6 +146,7 @@ declare module "react-native-maps" { rotation?: number; tracksViewChanges?: boolean tracksInfoWindowChanges?: boolean + stopPropagation?: boolean } export interface MapPolylineProps { diff --git a/lib/components/MapMarker.js b/lib/components/MapMarker.js index 5834d87..73b82b1 100644 --- a/lib/components/MapMarker.js +++ b/lib/components/MapMarker.js @@ -185,6 +185,14 @@ const propTypes = { tracksInfoWindowChanges: PropTypes.bool, + /** + * Stops Marker onPress events from propagating to and triggering MapView onPress events. + * + * @platform ios + */ + + stopPropagation: PropTypes.bool, + /** * Callback that is called when the user presses on the marker */ @@ -227,7 +235,7 @@ const propTypes = { }; const defaultProps = { - onPress() {}, + stopPropagation: false, }; class MapMarker extends React.Component { @@ -295,6 +303,14 @@ class MapMarker extends React.Component { {...this.props} image={image} style={[styles.marker, this.props.style]} + onPress={event => { + if (this.props.stopPropagation) { + event.stopPropagation(); + } + if (this.props.onPress) { + this.props.onPress(event); + } + }} /> ); }