Skip to content

Commit

Permalink
Map follow user location
Browse files Browse the repository at this point in the history
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 #5126

Reviewed By: svcscm

Differential Revision: D2803052

Pulled By: nicklockwood

fb-gh-sync-id: 2e8978ff1b293d699462a8290b45fa74cc16b4dd
  • Loading branch information
Crash-- authored and facebook-github-bot-5 committed Jan 6, 2016
1 parent 61025a9 commit 3d0ff69
Show file tree
Hide file tree
Showing 4 changed files with 28 additions and 17 deletions.
10 changes: 8 additions & 2 deletions Examples/UIExplorer/MapViewExample.js
Original file line number Diff line number Diff line change
Expand Up @@ -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}
/>
);
}
},
{
Expand Down
27 changes: 19 additions & 8 deletions Libraries/Components/MapView/MapView.js
Original file line number Diff line number Diff line change
Expand Up @@ -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`.
Expand Down Expand Up @@ -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,

Expand Down Expand Up @@ -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,
Expand Down Expand Up @@ -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}
Expand Down
4 changes: 0 additions & 4 deletions React/Views/RCTMap.m
Original file line number Diff line number Diff line change
Expand Up @@ -100,10 +100,6 @@ - (void)setShowsUserLocation:(BOOL)showsUserLocation
}
}
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;
}
}

Expand Down
4 changes: 1 addition & 3 deletions React/Views/RCTMapManager.m
Original file line number Diff line number Diff line change
Expand Up @@ -85,6 +85,7 @@ - (UIView *)view
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)
Expand Down Expand Up @@ -320,9 +321,6 @@ - (void)mapView:(RCTMap *)mapView didUpdateUserLocation:(MKUserLocation *)locati
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;
}
}

Expand Down

0 comments on commit 3d0ff69

Please sign in to comment.