Map follow user location
Summary: Fix #3105 It's the same PR as #3119 but as I force-pushed in my branch, I can't reopen the PR. I added an example. ![capture d ecran 2016-01-05 a 07 15 37](https://cloud.githubusercontent.com/assets/1107936/12108841/2727f504-b37c-11e5-8250-b53785930aba.png) Closes https://github.com/facebook/react-native/pull/5126 Reviewed By: svcscm Differential Revision: D2803052 Pulled By: nicklockwood fb-gh-sync-id: 2e8978ff1b293d699462a8290b45fa74cc16b4dd
This commit is contained in:
parent
61025a9b33
commit
3d0ff69e40
|
@ -290,9 +290,15 @@ exports.examples = [
|
|||
}
|
||||
},
|
||||
{
|
||||
title: 'Map shows user location',
|
||||
title: 'showsUserLocation + followUserLocation',
|
||||
render() {
|
||||
return <MapView style={styles.map} showsUserLocation={true} />;
|
||||
return (
|
||||
<MapView
|
||||
style={styles.map}
|
||||
showsUserLocation={true}
|
||||
followUserLocation={true}
|
||||
/>
|
||||
);
|
||||
}
|
||||
},
|
||||
{
|
||||
|
|
|
@ -49,15 +49,22 @@ const MapView = React.createClass({
|
|||
style: View.propTypes.style,
|
||||
|
||||
/**
|
||||
* If `true` the app will ask for the user's location and focus on it.
|
||||
* Default value is `false`.
|
||||
* If `true` the app will ask for the user's location and display it on
|
||||
* the map. Default value is `false`.
|
||||
*
|
||||
* **NOTE**: You need to add NSLocationWhenInUseUsageDescription key in
|
||||
* Info.plist to enable geolocation, otherwise it is going
|
||||
* to *fail silently*!
|
||||
* **NOTE**: on iOS, you need to add the `NSLocationWhenInUseUsageDescription`
|
||||
* key in Info.plist to enable geolocation, otherwise it will fail silently.
|
||||
*/
|
||||
showsUserLocation: React.PropTypes.bool,
|
||||
|
||||
/**
|
||||
* If `true` the map will follow the user's location whenever it changes.
|
||||
* Note that this has no effect unless `showsUserLocation` is enabled.
|
||||
* Default value is `true`.
|
||||
* @platform ios
|
||||
*/
|
||||
followUserLocation: React.PropTypes.bool,
|
||||
|
||||
/**
|
||||
* If `false` points of interest won't be displayed on the map.
|
||||
* Default value is `true`.
|
||||
|
@ -156,13 +163,11 @@ const MapView = React.createClass({
|
|||
|
||||
/**
|
||||
* Whether the pin should be draggable or not
|
||||
* @platform ios
|
||||
*/
|
||||
draggable: React.PropTypes.bool,
|
||||
|
||||
/**
|
||||
* Event that fires when the annotation drag state changes.
|
||||
* @platform ios
|
||||
*/
|
||||
onDragStateChange: React.PropTypes.func,
|
||||
|
||||
|
@ -282,7 +287,7 @@ const MapView = React.createClass({
|
|||
},
|
||||
|
||||
render: function() {
|
||||
let children = [], {annotations, overlays} = this.props;
|
||||
let children = [], {annotations, overlays, followUserLocation} = this.props;
|
||||
annotations = annotations && annotations.map((annotation: Object) => {
|
||||
let {
|
||||
id,
|
||||
|
@ -430,11 +435,17 @@ const MapView = React.createClass({
|
|||
};
|
||||
}
|
||||
|
||||
// followUserLocation defaults to true if showUserLocation is set
|
||||
if (followUserLocation === undefined) {
|
||||
followUserLocation = this.props.showUserLocation;
|
||||
}
|
||||
|
||||
return (
|
||||
<RCTMap
|
||||
{...this.props}
|
||||
annotations={annotations}
|
||||
children={children}
|
||||
followUserLocation={followUserLocation}
|
||||
overlays={overlays}
|
||||
onPress={onPress}
|
||||
onChange={onChange}
|
||||
|
|
|
@ -100,10 +100,6 @@ const CGFloat RCTMapZoomBoundBuffer = 0.01;
|
|||
}
|
||||
}
|
||||
super.showsUserLocation = showsUserLocation;
|
||||
|
||||
// If it needs to show user location, force map view centered
|
||||
// on user's current location on user location updates
|
||||
_followUserLocation = showsUserLocation;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -85,6 +85,7 @@ RCT_EXPORT_MODULE()
|
|||
RCT_EXPORT_VIEW_PROPERTY(showsUserLocation, BOOL)
|
||||
RCT_EXPORT_VIEW_PROPERTY(showsPointsOfInterest, BOOL)
|
||||
RCT_EXPORT_VIEW_PROPERTY(showsCompass, BOOL)
|
||||
RCT_EXPORT_VIEW_PROPERTY(followUserLocation, BOOL)
|
||||
RCT_EXPORT_VIEW_PROPERTY(zoomEnabled, BOOL)
|
||||
RCT_EXPORT_VIEW_PROPERTY(rotateEnabled, BOOL)
|
||||
RCT_EXPORT_VIEW_PROPERTY(pitchEnabled, BOOL)
|
||||
|
@ -320,9 +321,6 @@ RCT_CUSTOM_VIEW_PROPERTY(region, MKCoordinateRegion, RCTMap)
|
|||
region.span.longitudeDelta = RCTMapDefaultSpan;
|
||||
region.center = location.coordinate;
|
||||
[mapView setRegion:region animated:YES];
|
||||
|
||||
// Move to user location only for the first time it loads up.
|
||||
mapView.followUserLocation = NO;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue