Android: Use ViewGroupManager to Manage MapView

lovebing · Aug 16, 2016 · 1e6d8e0 · 1e6d8e0
1 parent 887a82e
commit 1e6d8e0
Show file tree

Hide file tree

Showing 6 changed files with 60 additions and 15 deletions.
diff --git a/android/src/main/java/org/lovebing/reactnative/baidumap/BaiduMapModule.java b/android/src/main/java/org/lovebing/reactnative/baidumap/BaiduMapModule.java
@@ -10,6 +10,7 @@
 import com.baidu.mapapi.map.BaiduMap;
 import com.baidu.mapapi.map.BitmapDescriptor;
 import com.baidu.mapapi.map.BitmapDescriptorFactory;
+import com.baidu.mapapi.map.Marker;
 import com.baidu.mapapi.search.geocode.ReverseGeoCodeOption;
 import com.facebook.react.bridge.Arguments;
 import com.facebook.react.bridge.ReactContextBaseJavaModule;
@@ -50,6 +51,8 @@ public class BaiduMapModule extends ReactContextBaseJavaModule {
 
     private LocationClient locationClient;
 
+    private Marker marker;
+
     public BaiduMapModule(ReactApplicationContext reactContext) {
         super(reactContext);
         context = reactContext;
@@ -61,12 +64,15 @@ public String getName() {
 
     @ReactMethod
     public void setMarker(double latitude, double longitude) {
+        if(marker != null) {
+            marker.remove();
+        }
         LatLng point = new LatLng(latitude, longitude);
         BitmapDescriptor bitmap = BitmapDescriptorFactory.fromResource(R.mipmap.icon_gcoding);
         OverlayOptions option = new MarkerOptions()
                 .icon(bitmap)
                 .position(point);
-        getMap().addOverlay(option);
+        marker = (Marker)getMap().addOverlay(option);
     }
 
     @ReactMethod

diff --git a/android/src/main/java/org/lovebing/reactnative/baidumap/BaiduMapViewManager.java b/android/src/main/java/org/lovebing/reactnative/baidumap/BaiduMapViewManager.java
@@ -1,8 +1,12 @@
 package org.lovebing.reactnative.baidumap;
 
 import android.content.Context;
+import android.graphics.Point;
+import android.os.Handler;
 import android.support.annotation.Nullable;
 import android.util.Log;
+import android.view.View;
+import android.view.ViewGroup;
 
 import com.baidu.mapapi.map.BaiduMap;
 import com.baidu.mapapi.map.MapPoi;
@@ -11,26 +15,31 @@
 import com.baidu.mapapi.map.MapStatusUpdateFactory;
 import com.baidu.mapapi.map.MapView;
 import com.baidu.mapapi.SDKInitializer;
+import com.baidu.mapapi.map.MapViewLayoutParams;
 import com.baidu.mapapi.map.Marker;
 import com.baidu.mapapi.model.LatLng;
 import com.facebook.react.bridge.Arguments;
+import com.facebook.react.bridge.ReadableArray;
+import com.facebook.react.bridge.ReadableMap;
 import com.facebook.react.bridge.WritableMap;
-import com.facebook.react.modules.core.DeviceEventManagerModule;
 import com.facebook.react.uimanager.SimpleViewManager;
 import com.facebook.react.uimanager.ThemedReactContext;
+import com.facebook.react.uimanager.ViewGroupManager;
 import com.facebook.react.uimanager.annotations.ReactProp;
 import com.facebook.react.uimanager.events.RCTEventEmitter;
 
 /**
  * Created by lovebing on 12/20/2015.
  */
-public class BaiduMapViewManager extends SimpleViewManager<MapView> {
+public class BaiduMapViewManager extends ViewGroupManager<MapView> {
 
     private static final String REACT_CLASS = "RCTBaiduMapView";
 
     private static MapView mMapView;
     private ThemedReactContext mReactContext;
 
+    private ReadableArray childrenPoints;
+
     public String getName() {
         return REACT_CLASS;
     }
@@ -52,6 +61,24 @@ public MapView createViewInstance(ThemedReactContext context) {
         return mMapView;
     }
 
+    @Override
+    public void addView(MapView parent, View child, int index) {
+        if(childrenPoints != null) {
+            Point point = new Point();
+            ReadableArray item = childrenPoints.getArray(index);
+            if(item != null) {
+                point.set(item.getInt(0), item.getInt(1));
+                MapViewLayoutParams mapViewLayoutParams = new MapViewLayoutParams
+                        .Builder()
+                        .layoutMode(MapViewLayoutParams.ELayoutMode.absoluteMode)
+                        .point(point)
+                        .build();
+                parent.addView(child, mapViewLayoutParams);
+            }
+        }
+
+    }
+
     @ReactProp(name = "zoomControlsVisible")
     public void setZoomControlsVisible(MapView mapView, boolean zoomControlsVisible) {
         mapView.showZoomControls(zoomControlsVisible);
@@ -69,6 +96,11 @@ public void setZoom(MapView mapView, float zoom) {
         mapView.getMap().setMapStatus(mapStatusUpdate);
     }
 
+    @ReactProp(name = "childrenPoints")
+    public void setChildrenPoints(MapView mapView, ReadableArray childrenPoints) {
+        this.childrenPoints = childrenPoints;
+    }
+
     /**
      *
      * @param mapView

diff --git a/demo/BaiduMapDemo.js b/demo/BaiduMapDemo.js
@@ -61,12 +61,16 @@ export default class BaiduMapDemo extends Component {
     return (
       <View style={styles.container}>
         <MapView 
+          childrenPoints={[[330, 50], [580, 200]]}
           zoom={this.zoom}
           style={styles.map}
           onMapClick={(e) => {
-
           }}
-        />
+        >
+          <Text style={{color: 'red', backgroundColor: null,  width: Dimensions.get('window').width}}>ViewGroup is not allowed (Android)</Text>
+          <Text style={{color: 'black', width: Dimensions.get('window').width}}>This is not a good idea to add children view to Baidu MapView</Text>
+        </MapView>
+
         <View style={styles.row}>
           <Buttton label="普通地图" onPress={() => {
             MapModule.setMapType(MapTypes.NORMAL);
@@ -108,7 +112,8 @@ export default class BaiduMapDemo extends Component {
 
 const styles = StyleSheet.create({
   row: {
-    flexDirection: 'row'
+    flexDirection: 'row',
+    justifyContent: 'flex-start'
   },
   btn: {
     height: 48,

diff --git a/demo/android/app/app.iml b/demo/android/app/app.iml
@@ -64,14 +64,6 @@
       <sourceFolder url="file://$MODULE_DIR$/src/main/jni" isTestSource="false" />
       <sourceFolder url="file://$MODULE_DIR$/src/main/rs" isTestSource="false" />
       <sourceFolder url="file://$MODULE_DIR$/src/main/shaders" isTestSource="false" />
-      <sourceFolder url="file://$MODULE_DIR$/src/test/res" type="java-test-resource" />
-      <sourceFolder url="file://$MODULE_DIR$/src/test/resources" type="java-test-resource" />
-      <sourceFolder url="file://$MODULE_DIR$/src/test/assets" type="java-test-resource" />
-      <sourceFolder url="file://$MODULE_DIR$/src/test/aidl" isTestSource="true" />
-      <sourceFolder url="file://$MODULE_DIR$/src/test/java" isTestSource="true" />
-      <sourceFolder url="file://$MODULE_DIR$/src/test/jni" isTestSource="true" />
-      <sourceFolder url="file://$MODULE_DIR$/src/test/rs" isTestSource="true" />
-      <sourceFolder url="file://$MODULE_DIR$/src/test/shaders" isTestSource="true" />
       <sourceFolder url="file://$MODULE_DIR$/src/androidTest/res" type="java-test-resource" />
       <sourceFolder url="file://$MODULE_DIR$/src/androidTest/resources" type="java-test-resource" />
       <sourceFolder url="file://$MODULE_DIR$/src/androidTest/assets" type="java-test-resource" />
@@ -80,6 +72,14 @@
       <sourceFolder url="file://$MODULE_DIR$/src/androidTest/jni" isTestSource="true" />
       <sourceFolder url="file://$MODULE_DIR$/src/androidTest/rs" isTestSource="true" />
       <sourceFolder url="file://$MODULE_DIR$/src/androidTest/shaders" isTestSource="true" />
+      <sourceFolder url="file://$MODULE_DIR$/src/test/res" type="java-test-resource" />
+      <sourceFolder url="file://$MODULE_DIR$/src/test/resources" type="java-test-resource" />
+      <sourceFolder url="file://$MODULE_DIR$/src/test/assets" type="java-test-resource" />
+      <sourceFolder url="file://$MODULE_DIR$/src/test/aidl" isTestSource="true" />
+      <sourceFolder url="file://$MODULE_DIR$/src/test/java" isTestSource="true" />
+      <sourceFolder url="file://$MODULE_DIR$/src/test/jni" isTestSource="true" />
+      <sourceFolder url="file://$MODULE_DIR$/src/test/rs" isTestSource="true" />
+      <sourceFolder url="file://$MODULE_DIR$/src/test/shaders" isTestSource="true" />
       <excludeFolder url="file://$MODULE_DIR$/build/intermediates/assets" />
       <excludeFolder url="file://$MODULE_DIR$/build/intermediates/blame" />
       <excludeFolder url="file://$MODULE_DIR$/build/intermediates/builds" />

diff --git a/...deproj/project.xcworkspace/xcuserdata/lovebing.xcuserdatad/UserInterfaceState.xcuserstate b/...deproj/project.xcworkspace/xcuserdata/lovebing.xcuserdatad/UserInterfaceState.xcuserstate
diff --git a/index.js b/index.js
@@ -23,6 +23,7 @@ export class MapView extends Component {
     zoomControlsVisible: PropTypes.bool,
     mapType: PropTypes.number,
     zoom: PropTypes.number,
+    childrenPoints: PropTypes.array,
     onMapStatusChangeStart: PropTypes.func,
     onMapStatusChange: PropTypes.func,
     onMapStatusChangeFinish: PropTypes.func,
@@ -34,7 +35,8 @@ export class MapView extends Component {
 
   static defaultProps = {
     zoomControlsVisible: true,
-    mapType: MapTypes.NORMAL
+    mapType: MapTypes.NORMAL,
+    childrenPoints: []
   };
 
   constructor() {