Skip to content

Commit 7c7b8c2

Browse files
author
Rodrigo Solis
committed
Merge branch 'master' of https://github.com/airbnb/react-native-maps into upstream-update
* 'master' of https://github.com/airbnb/react-native-maps: v0.17.0 Update index.d.ts v0.16.4 [MapMarker] fix android release crash on custom marker (react-native-maps#1643) Add support for animateToViewingAngle and animateToBearing for Android Bump 0.16.3 Revert "[MapView] revert initialRegion change (react-native-maps#1613)" [MapView] revert initialRegion change (react-native-maps#1613) Added missing satellite option for iOS Google Maps (react-native-maps#1603) Remove legalNotice from android AirMapModule As per https://developers.google.com/android/reference/com/google/android/gms/common/GooglePlayServicesUtil this information does not need to be displayed in app. Set initial region on view (react-native-maps#1579) Added Typescript Definitions Updated "showsIndoorLevelPicker" documentation. Added [iOS / Google Maps] support for showsIndoorLevelPicker. Fall back to View.propTypes if ViewPropTypes is not available (react-native-maps#1473) (react-native-maps#1474) fixe mistakes on circle.md (react-native-maps#1584) Add support for AirMap (Native IOS Maps) as suggested on the PR comments. Adds support to animateToBearing and animateToViewingAngle functions on IOS. fix rare android crashes when map size is 0 Remove caret from "react": "^16.0.0-alpha.12"
2 parents f11208e + 8f0b21e commit 7c7b8c2

17 files changed

+375
-24
lines changed

CHANGELOG.md

+15
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,20 @@
11
# Change Log
22

3+
## 0.17.0 (October 11, 2017)
4+
* iOS: [#1527](https://github.com/airbnb/react-native-maps/pull/1527) Added [iOS / Google Maps] support for showsIndoorLevelPicker
5+
* iOS/Android: [#1544](https://github.com/airbnb/react-native-maps/pull/1544) Adds support to animateToBearing and animateToViewingAngle ( IOS + Android )
6+
* JS: [#1503](https://github.com/airbnb/react-native-maps/pull/1503) Remove caret from "react": "^16.0.0-alpha.12
7+
* Android: [#1521](https://github.com/airbnb/react-native-maps/pull/1521) Fix rare android crashes when map size is 0
8+
* Common: [#1610](https://github.com/airbnb/react-native-maps/pull/1610) Added Typescript Definitions
9+
* Android: [#1612](https://github.com/airbnb/react-native-maps/pull/1612) Remove legalNotice from android AirMapModule
10+
11+
## 0.16.4 (September 13, 2017)
12+
* Android: [#1643](https://github.com/airbnb/react-native-maps/pull/1643) [MapMarker] fix android release crash on custom marker
13+
14+
## 0.16.3 (September 2, 2017)
15+
* iOS: [#1603](https://github.com/airbnb/react-native-maps/pull/1603) Added missing satellite option for iOS Google Maps
16+
* iOS: [#1579](https://github.com/airbnb/react-native-maps/pull/1579) Set initial region on view
17+
318
## 0.16.2 (August 17, 2017)
419
* Android: [#1563](https://github.com/airbnb/react-native-maps/pull/#1563) Add missing native method for setting initial region
520
* iOS: [#1187](https://github.com/airbnb/react-native-maps/pull/1187) Reverted due to build issues

docs/circle.md

+2-2
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,8 @@
1010
| `strokeColor` | `String` | `#000`, `rgba(r,g,b,0.5)` | The stroke color to use for the path.
1111
| `fillColor` | `String` | `#000`, `rgba(r,g,b,0.5)` | The fill color to use for the path.
1212
| `zIndex` | `Number` | 0 | The order in which this tile overlay is drawn with respect to other overlays. An overlay with a larger z-index is drawn over overlays with smaller z-indices. The order of overlays with the same z-index is arbitrary. The default zIndex is 0. (Android Only)
13-
| `lineCap` | `String` | `round` | The line cap style to apply to the open ends of the path.
14-
| `lineJoin` | `Array<LatLng>` | | The line join style to apply to corners of the path.
13+
| `lineCap` | `String` | `round` | The line cap style to apply to the open ends of the path. Other values : `butt`, `square`
14+
| `lineJoin` | `String` | | The line join style to apply to corners of the path. possible value: `miter`, `round`, `bevel`
1515
| `miterLimit` | `Number` | | The limiting value that helps avoid spikes at junctions between connected line segments. The miter limit helps you avoid spikes in paths that use the `miter` `lineJoin` style. If the ratio of the miter length—that is, the diagonal length of the miter join—to the line thickness exceeds the miter limit, the joint is converted to a bevel join. The default miter limit is 10, which results in the conversion of miters whose angle at the joint is less than 11 degrees.
1616
| `geodesic` | `Boolean` | | Boolean to indicate whether to draw each segment of the line as a geodesic as opposed to straight lines on the Mercator projection. A geodesic is the shortest path between two points on the Earth's surface. The geodesic curve is constructed assuming the Earth is a sphere.
1717
| `lineDashPhase` | `Number` | `0` | (iOS only) The offset (in points) at which to start drawing the dash pattern. Use this property to start drawing a dashed line partway through a segment or gap. For example, a phase value of 6 for the patter 5-2-3-2 would cause drawing to begin in the middle of the first gap.

docs/mapview.md

+3-1
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@
2020
| `showsBuildings` | `Boolean` | `true` | A Boolean indicating whether the map displays extruded building information.
2121
| `showsTraffic` | `Boolean` | `true` | A Boolean value indicating whether the map displays traffic information.
2222
| `showsIndoors` | `Boolean` | `true` | A Boolean indicating whether indoor maps should be enabled.
23-
| `showsIndoorLevelPicker` | `Boolean` | `false` | A Boolean indicating whether indoor level picker should be enabled. **Note:** Android only.
23+
| `showsIndoorLevelPicker` | `Boolean` | `false` | A Boolean indicating whether indoor level picker should be enabled. **Note:** Google Maps only (either Android or iOS with `PROVIDER_GOOGLE`).
2424
| `zoomEnabled` | `Boolean` | `true` | If `false` the user won't be able to pinch/zoom the map.
2525
| `minZoomLevel` | `Number` | `0` | Minimum zoom value for the map, must be between 0 and 20
2626
| `maxZoomLevel` | `Number` | `20` | Maximum zoom value for the map, must be between 0 and 20
@@ -64,6 +64,8 @@ To access event data, you will need to use `e.nativeEvent`. For example, `onPres
6464
|---|---|---|
6565
| `animateToRegion` | `region: Region`, `duration: Number` |
6666
| `animateToCoordinate` | `coordinate: LatLng`, `duration: Number` |
67+
| `animateToBearing` | `bearing: Number`, `duration: Number` |
68+
| `animateToViewingAngle` | `angle: Number`, `duration: Number` |
6769
| `fitToElements` | `animated: Boolean` |
6870
| `fitToSuppliedMarkers` | `markerIDs: String[]`, `animated: Boolean` | If you need to use this in `ComponentDidMount`, make sure you put it in a timeout or it will cause performance problems.
6971
| `fitToCoordinates` | `coordinates: Array<LatLng>, options: { edgePadding: EdgePadding, animated: Boolean }` | If called in `ComponentDidMount` in android, it will cause an exception. It is recommended to call it from the MapView `onLayout` event.

example/examples/DisplayLatLng.js

+24
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,18 @@ class DisplayLatLng extends React.Component {
4747
this.map.animateToCoordinate(this.randomCoordinate());
4848
}
4949

50+
animateToRandomBearing() {
51+
this.map.animateToBearing(this.getRandomFloat(-360, 360));
52+
}
53+
54+
animateToRandomViewingAngle() {
55+
this.map.animateToViewingAngle(this.getRandomFloat(0, 90));
56+
}
57+
58+
getRandomFloat(min, max) {
59+
return (Math.random() * (max - min)) + min;
60+
}
61+
5062
randomCoordinate() {
5163
const region = this.state.region;
5264
return {
@@ -98,6 +110,18 @@ class DisplayLatLng extends React.Component {
98110
>
99111
<Text style={styles.buttonText}>Animate (Coordinate)</Text>
100112
</TouchableOpacity>
113+
<TouchableOpacity
114+
onPress={() => this.animateToRandomBearing()}
115+
style={[styles.bubble, styles.button]}
116+
>
117+
<Text style={styles.buttonText}>Animate (Bearing)</Text>
118+
</TouchableOpacity>
119+
<TouchableOpacity
120+
onPress={() => this.animateToRandomViewingAngle()}
121+
style={[styles.bubble, styles.button]}
122+
>
123+
<Text style={styles.buttonText}>Animate (View Angle)</Text>
124+
</TouchableOpacity>
101125
</View>
102126
</View>
103127
);

index.d.ts

+156
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,156 @@
1+
import * as React from 'react';
2+
3+
interface MapViewProps {
4+
provider?: 'google';
5+
style: any;
6+
customMapStyle?: any[];
7+
customMapStyleString?: string;
8+
showsUserLocation?: boolean;
9+
userLocationAnnotationTitle?: string;
10+
showsMyLocationButton?: boolean;
11+
followsUserLocation?: boolean;
12+
showsPointsOfInterest?: boolean;
13+
showsCompass?: boolean;
14+
zoomEnabled?: boolean;
15+
rotateEnabled?: boolean;
16+
cacheEnabled?: boolean;
17+
loadingEnabled?: boolean;
18+
loadingBackgroundColor?: any;
19+
loadingIndicatorColor?: any;
20+
scrollEnabled?: boolean;
21+
pitchEnabled?: boolean;
22+
toolbarEnabled?: boolean;
23+
moveOnMarkerPress?: boolean;
24+
showsScale?: boolean;
25+
showsBuildings?: boolean;
26+
showsTraffic?: boolean;
27+
showsIndoors?: boolean;
28+
showsIndoorLevelPicker?: boolean;
29+
mapType?: 'standard' | 'satellite' | 'hybrid' | 'terrain' | 'none';
30+
region?: { latitude: number; longitude: number; latitudeDelta: number; longitudeDelta: number; };
31+
initialRegion?: { latitude: number; longitude: number; latitudeDelta: number; longitudeDelta: number; };
32+
liteMode?: boolean;
33+
maxDelta?: number;
34+
minDelta?: number;
35+
legalLabelInsets?: any;
36+
onChange?: Function;
37+
onMapReady?: Function;
38+
onRegionChange?: Function;
39+
onRegionChangeComplete?: Function;
40+
onPress?: Function;
41+
onLayout?: Function;
42+
onLongPress?: Function;
43+
onPanDrag?: Function;
44+
onMarkerPress?: Function;
45+
onMarkerSelect?: Function;
46+
onMarkerDeselect?: Function;
47+
onCalloutPress?: Function;
48+
onMarkerDragStart?: Function;
49+
onMarkerDrag?: Function;
50+
onMarkerDragEnd?: Function;
51+
minZoomLevel?: number;
52+
maxZoomLevel?: number;
53+
}
54+
55+
declare class MapView extends React.Component<MapViewProps, any> {
56+
static Animated: any;
57+
static AnimatedRegion: any;
58+
}
59+
60+
declare namespace MapView {
61+
62+
type LineCapType = 'butt' | 'round' | 'square';
63+
type LineJoinType = 'miter' | 'round' | 'bevel';
64+
65+
interface MarkerProps {
66+
identifier?: string;
67+
reuseIdentifier?: string;
68+
title?: string;
69+
description?: string;
70+
image?: any;
71+
opacity?: number;
72+
pinColor?: string;
73+
coordinate: { latitude: number; longitude: number };
74+
centerOffset?: { x: number; y: number };
75+
calloutOffset?: { x: number; y: number };
76+
anchor?: { x: number; y: number };
77+
calloutAnchor?: { x: number; y: number };
78+
flat?: boolean;
79+
draggable?: boolean;
80+
onPress?: Function;
81+
onSelect?: Function;
82+
onDeselect?: Function;
83+
onCalloutPress?: Function;
84+
onDragStart?: Function;
85+
onDrag?: Function;
86+
onDragEnd?: Function;
87+
zIndex?: number;
88+
}
89+
90+
interface MapPolylineProps {
91+
coordinates?: { latitude: number; longitude: number; }[];
92+
onPress?: Function;
93+
tappable?: boolean;
94+
fillColor?: string;
95+
strokeWidth?: number;
96+
strokeColor?: string;
97+
zIndex?: number;
98+
lineCap?: LineCapType;
99+
lineJoin?: LineJoinType;
100+
miterLimit?: number;
101+
geodesic?: boolean;
102+
lineDashPhase?: number;
103+
lineDashPattern?: number[];
104+
}
105+
106+
interface MapPolygonProps {
107+
coordinates?: { latitude: number; longitude: number; }[];
108+
holes?: { latitude: number; longitude: number; }[][];
109+
onPress?: Function;
110+
tappable?: boolean;
111+
strokeWidth?: number;
112+
strokeColor?: string;
113+
fillColor?: string;
114+
zIndex?: number;
115+
lineCap?: LineCapType;
116+
lineJoin?: LineJoinType;
117+
miterLimit?: number;
118+
geodesic?: boolean;
119+
lineDashPhase?: number;
120+
lineDashPattern?: number[];
121+
}
122+
123+
interface MapCircleProps {
124+
center: { latitude: number; longitude: number };
125+
radius: number;
126+
onPress?: Function;
127+
strokeWidth?: number;
128+
strokeColor?: string;
129+
fillColor?: string;
130+
zIndex?: number;
131+
lineCap?: LineCapType;
132+
lineJoin?: LineJoinType;
133+
miterLimit?: number;
134+
lineDashPhase?: number;
135+
lineDashPattern?: number[];
136+
}
137+
138+
interface MapUrlTitleProps {
139+
urlTemplate: string;
140+
zIndex?: number;
141+
}
142+
143+
interface MapCalloutProps {
144+
tooltip?: boolean;
145+
onPress?: Function;
146+
}
147+
148+
export class Marker extends React.Component<MarkerProps, any> {}
149+
export class Polyline extends React.Component<MapPolylineProps, any> {}
150+
export class Polygon extends React.Component<MapPolygonProps, any> {}
151+
export class Circle extends React.Component<MapCircleProps, any> {}
152+
export class UrlTile extends React.Component<MapUrlTitleProps, any> {}
153+
export class Callout extends React.Component<MapCalloutProps, any> {}
154+
}
155+
156+
export = MapView;

lib/android/gradle.properties

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
VERSION_CODE=4
2-
VERSION_NAME=0.16.2
2+
VERSION_NAME=0.17.0
33
GROUP=com.airbnb.android
44

55
POM_DESCRIPTION=React Native Map view component for Android

lib/android/src/main/java/com/airbnb/android/react/maps/AirMapManager.java

+21-3
Original file line numberDiff line numberDiff line change
@@ -29,9 +29,11 @@ public class AirMapManager extends ViewGroupManager<AirMapView> {
2929
private static final String REACT_CLASS = "AIRMap";
3030
private static final int ANIMATE_TO_REGION = 1;
3131
private static final int ANIMATE_TO_COORDINATE = 2;
32-
private static final int FIT_TO_ELEMENTS = 3;
33-
private static final int FIT_TO_SUPPLIED_MARKERS = 4;
34-
private static final int FIT_TO_COORDINATES = 5;
32+
private static final int ANIMATE_TO_VIEWING_ANGLE = 3;
33+
private static final int ANIMATE_TO_BEARING = 4;
34+
private static final int FIT_TO_ELEMENTS = 5;
35+
private static final int FIT_TO_SUPPLIED_MARKERS = 6;
36+
private static final int FIT_TO_COORDINATES = 7;
3537

3638
private final Map<String, Integer> MAP_TYPES = MapBuilder.of(
3739
"standard", GoogleMap.MAP_TYPE_NORMAL,
@@ -200,6 +202,8 @@ public void receiveCommand(AirMapView view, int commandId, @Nullable ReadableArr
200202
Double lng;
201203
Double lngDelta;
202204
Double latDelta;
205+
float bearing;
206+
float angle;
203207
ReadableMap region;
204208

205209
switch (commandId) {
@@ -225,6 +229,18 @@ public void receiveCommand(AirMapView view, int commandId, @Nullable ReadableArr
225229
view.animateToCoordinate(new LatLng(lat, lng), duration);
226230
break;
227231

232+
case ANIMATE_TO_VIEWING_ANGLE:
233+
angle = (float)args.getDouble(0);
234+
duration = args.getInt(1);
235+
view.animateToViewingAngle(angle, duration);
236+
break;
237+
238+
case ANIMATE_TO_BEARING:
239+
bearing = (float)args.getDouble(0);
240+
duration = args.getInt(1);
241+
view.animateToBearing(bearing, duration);
242+
break;
243+
228244
case FIT_TO_ELEMENTS:
229245
view.fitToElements(args.getBoolean(0));
230246
break;
@@ -267,6 +283,8 @@ public Map<String, Integer> getCommandsMap() {
267283
return MapBuilder.of(
268284
"animateToRegion", ANIMATE_TO_REGION,
269285
"animateToCoordinate", ANIMATE_TO_COORDINATE,
286+
"animateToViewingAngle", ANIMATE_TO_VIEWING_ANGLE,
287+
"animateToBearing", ANIMATE_TO_BEARING,
270288
"fitToElements", FIT_TO_ELEMENTS,
271289
"fitToSuppliedMarkers", FIT_TO_SUPPLIED_MARKERS,
272290
"fitToCoordinates", FIT_TO_COORDINATES

lib/android/src/main/java/com/airbnb/android/react/maps/AirMapMarker.java

+4
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22

33
import android.content.Context;
44
import android.graphics.Bitmap;
5+
import android.graphics.BitmapFactory;
56
import android.graphics.Canvas;
67
import android.graphics.drawable.Animatable;
78
import android.net.Uri;
@@ -236,6 +237,9 @@ public void setImage(String uri) {
236237
logoHolder.setController(controller);
237238
} else {
238239
iconBitmapDescriptor = getBitmapDescriptorByName(uri);
240+
if (iconBitmapDescriptor != null) {
241+
iconBitmap = BitmapFactory.decodeResource(getResources(), getDrawableResourceByName(uri));
242+
}
239243
update();
240244
}
241245
}

lib/android/src/main/java/com/airbnb/android/react/maps/AirMapModule.java

+1-1
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@ public String getName() {
4747
@Override
4848
public Map<String, Object> getConstants() {
4949
final Map<String, Object> constants = new HashMap<>();
50-
constants.put("legalNotice", GoogleApiAvailability.getInstance().getOpenSourceSoftwareLicenseInfo(getReactApplicationContext()));
50+
constants.put("legalNotice", "This license information is displayed in Settings > Google > Open Source on any device running Google Play services.");
5151
return constants;
5252
}
5353

lib/android/src/main/java/com/airbnb/android/react/maps/AirMapView.java

+31-10
Original file line numberDiff line numberDiff line change
@@ -563,16 +563,17 @@ public void updateExtraData(Object extraData) {
563563
// a proper camera move
564564
if (boundsToMove != null) {
565565
HashMap<String, Float> data = (HashMap<String, Float>) extraData;
566-
float width = data.get("width");
567-
float height = data.get("height");
568-
map.moveCamera(
569-
CameraUpdateFactory.newLatLngBounds(
570-
boundsToMove,
571-
(int) width,
572-
(int) height,
573-
0
574-
)
575-
);
566+
int width = data.get("width") == null ? 0 : data.get("width").intValue();
567+
int height = data.get("height") == null ? 0 : data.get("height").intValue();
568+
569+
//fix for https://github.com/airbnb/react-native-maps/issues/245,
570+
//it's not guaranteed the passed-in height and width would be greater than 0.
571+
if (width <= 0 || height <= 0) {
572+
map.moveCamera(CameraUpdateFactory.newLatLngBounds(boundsToMove, 0));
573+
} else {
574+
map.moveCamera(CameraUpdateFactory.newLatLngBounds(boundsToMove, width, height, 0));
575+
}
576+
576577
boundsToMove = null;
577578
}
578579
}
@@ -584,6 +585,26 @@ public void animateToRegion(LatLngBounds bounds, int duration) {
584585
}
585586
}
586587

588+
public void animateToViewingAngle(float angle, int duration) {
589+
if (map != null) {
590+
startMonitoringRegion();
591+
CameraPosition cameraPosition = new CameraPosition.Builder(map.getCameraPosition())
592+
.tilt(angle)
593+
.build();
594+
map.animateCamera(CameraUpdateFactory.newCameraPosition(cameraPosition), duration, null);
595+
}
596+
}
597+
598+
public void animateToBearing(float bearing, int duration) {
599+
if (map != null) {
600+
startMonitoringRegion();
601+
CameraPosition cameraPosition = new CameraPosition.Builder(map.getCameraPosition())
602+
.bearing(bearing)
603+
.build();
604+
map.animateCamera(CameraUpdateFactory.newCameraPosition(cameraPosition), duration, null);
605+
}
606+
}
607+
587608
public void animateToCoordinate(LatLng coordinate, int duration) {
588609
if (map != null) {
589610
startMonitoringRegion();

0 commit comments

Comments
 (0)