feat: add onRegionChangeStart event to MapView (#5144)

android/src/main/java/com/rnmaps/maps/MapManager.java

@@ -444,7 +444,8 @@ public Map getExportedCustomDirectEventTypeConstants() {
                 "onDoublePress", MapBuilder.of("registrationName", "onDoublePress"),
                 "onMapLoaded", MapBuilder.of("registrationName", "onMapLoaded"),
                 "onMarkerSelect", MapBuilder.of("registrationName", "onMarkerSelect"),
-                "onMarkerDeselect", MapBuilder.of("registrationName", "onMarkerDeselect")
+                "onMarkerDeselect", MapBuilder.of("registrationName", "onMarkerDeselect"),
+                "onRegionChangeStart", MapBuilder.of("registrationName", "onRegionChangeStart")
         ));
 
         return map;

android/src/main/java/com/rnmaps/maps/MapView.java

@@ -381,6 +381,10 @@ public void onGroundOverlayClick(@NonNull GroundOverlay groundOverlay) {
       @Override
       public void onCameraMoveStarted(int reason) {
         cameraMoveReason = reason;
+        boolean isGesture = GoogleMap.OnCameraMoveStartedListener.REASON_GESTURE == reason;
+        WritableMap event = new WritableNativeMap();
+        event.putBoolean("isGesture", isGesture);
+        manager.pushEvent(context, view, "onRegionChangeStart", event);
       }
     });
 

docs/mapview.md

@@ -61,6 +61,7 @@ To access event data, you will need to use `e.nativeEvent`. For example, `onPres
 | ------------------------- | ------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
 | `onMapReady`              |                                                                          | Callback that is called once the map is fully loaded.                                                                                                                                                                                                                                                                                 |
 | `onKmlReady`              | `KmlContainer`                                                           | Callback that is called once the kml is fully loaded.                                                                                                                                                                                                                                                                                 |
+| `onRegionChangeStart`     | `{ isGesture: boolean }`                                                 | Callback that is called once before the region changes, such as when the user starts moving the map. The second parameter is an object containing more details about the move. `isGesture` property indicates if the move was from the user (true) or an animation (false). **Note**: `isGesture` is supported by Google Maps only.   |
 | `onRegionChange`          | (`Region`, `{isGesture: boolean}`)                                       | Callback that is called continuously when the region changes, such as when a user is dragging the map. The second parameter is an object containing more details about the move. `isGesture` property indicates if the move was from the user (true) or an animation (false). **Note**: `isGesture` is supported by Google Maps only. |
 | `onRegionChangeComplete`  | (`Region`, `{isGesture: boolean}`)                                       | Callback that is called once when the region changes, such as when the user is done moving the map. The second parameter is an object containing more details about the move. `isGesture` property indicates if the move was from the user (true) or an animation (false). **Note**: `isGesture` is supported by Google Maps only.    |
 | `onUserLocationChange`    | `{ coordinate: Location }`                                               | Callback that is called when the underlying map figures our users current location (coordinate also includes isFromMockProvider value for Android API 18 and above). Make sure **showsUserLocation** is set to _true_.                                                                                                                |

example/src/examples/EventListener.tsx

@@ -73,6 +73,7 @@ class EventListener extends React.Component<any, any> {
           initialRegion={this.state.region}
           showsUserLocation
           showsMyLocationButton
+          onRegionChangeStart={this.recordEvent('Map::onRegionChangeStart')}
           onRegionChange={this.recordEvent('Map::onRegionChange')}
           onRegionChangeComplete={this.recordEvent(
             'Map::onRegionChangeComplete',

ios/AirGoogleMaps/AIRGoogleMap.h

@@ -38,6 +38,7 @@
 @property (nonatomic, copy) RCTBubblingEventBlock onMarkerDeselect;
 @property (nonatomic, copy) RCTBubblingEventBlock onChange;
 @property (nonatomic, copy) RCTBubblingEventBlock onPoiClick;
+@property (nonatomic, copy) RCTDirectEventBlock onRegionChangeStart;
 @property (nonatomic, copy) RCTDirectEventBlock onRegionChange;
 @property (nonatomic, copy) RCTDirectEventBlock onRegionChangeComplete;
 @property (nonatomic, copy) RCTDirectEventBlock onIndoorLevelActivated;
@@ -72,6 +73,7 @@
 - (void)didTapPolygon:(GMSPolygon *)polygon;
 - (void)didTapAtCoordinate:(CLLocationCoordinate2D)coordinate;
 - (void)didLongPressAtCoordinate:(CLLocationCoordinate2D)coordinate;
+- (void)willMove:(BOOL)gesture;
 - (void)didChangeCameraPosition:(GMSCameraPosition *)position isGesture:(BOOL)isGesture;
 - (void)idleAtCameraPosition:(GMSCameraPosition *)position isGesture:(BOOL)isGesture;
 - (void)didTapPOIWithPlaceID:(NSString *)placeID name:(NSString *) name location:(CLLocationCoordinate2D) location;

ios/AirGoogleMaps/AIRGoogleMap.m

@@ -403,6 +403,11 @@ - (void)didLongPressAtCoordinate:(CLLocationCoordinate2D)coordinate {
   self.onLongPress([self eventFromCoordinate:coordinate]);
 }
 
+- (void)willMove:(BOOL)gesture {
+  id event = @{@"isGesture": [NSNumber numberWithBool:gesture]};
+  if (self.onRegionChangeStart) self.onRegionChangeStart(event);
+}
+
 - (void)didChangeCameraPosition:(GMSCameraPosition *)position isGesture:(BOOL)isGesture{
   id event = @{@"continuous": @YES,
                @"region": regionAsJSON([AIRGoogleMap makeGMSCameraPositionFromMap:self andGMSCameraPosition:position]),

ios/AirGoogleMaps/AIRGoogleMapManager.m

@@ -117,6 +117,7 @@ - (UIView *)view
 RCT_EXPORT_VIEW_PROPERTY(onMarkerPress, RCTDirectEventBlock)
 RCT_EXPORT_VIEW_PROPERTY(onMarkerSelect, RCTDirectEventBlock)
 RCT_EXPORT_VIEW_PROPERTY(onMarkerDeselect, RCTDirectEventBlock)
+RCT_EXPORT_VIEW_PROPERTY(onRegionChangeStart, RCTDirectEventBlock)
 RCT_EXPORT_VIEW_PROPERTY(onRegionChange, RCTDirectEventBlock)
 RCT_EXPORT_VIEW_PROPERTY(onRegionChangeComplete, RCTDirectEventBlock)
 RCT_EXPORT_VIEW_PROPERTY(onPoiClick, RCTDirectEventBlock)
@@ -511,8 +512,10 @@ - (NSDictionary *)constantsToExport {
   return @{ @"legalNotice": [GMSServices openSourceLicenseInfo] };
 }
 
-- (void)mapView:(GMSMapView *)mapView willMove:(BOOL)gesture{
-    self.isGesture = gesture;
+- (void)mapView:(GMSMapView *)mapView willMove:(BOOL)gesture {
+  self.isGesture = gesture;
+  AIRGoogleMap *googleMapView = (AIRGoogleMap *)mapView;
+  [googleMapView willMove:gesture];
 }
 
 - (void)mapViewDidStartTileRendering:(GMSMapView *)mapView {

ios/AirMaps/AIRMap.h

@@ -67,6 +67,7 @@ extern const NSInteger AIRMapMaxZoomLevel;
 @property (nonatomic, copy) RCTDirectEventBlock onMarkerDragEnd;
 
 @property (nonatomic, copy) RCTDirectEventBlock onCalloutPress;
+@property (nonatomic, copy) RCTDirectEventBlock onRegionChangeStart;
 @property (nonatomic, copy) RCTDirectEventBlock onRegionChange;
 @property (nonatomic, copy) RCTBubblingEventBlock onUserLocationChange;
 

ios/AirMaps/AIRMapManager.m

@@ -113,6 +113,7 @@ - (UIView *)view
 RCT_EXPORT_VIEW_PROPERTY(cameraZoomRange, NSDictionary)
 RCT_EXPORT_VIEW_PROPERTY(onMapReady, RCTBubblingEventBlock)
 RCT_EXPORT_VIEW_PROPERTY(onChange, RCTBubblingEventBlock)
+RCT_EXPORT_VIEW_PROPERTY(onRegionChangeStart, RCTDirectEventBlock)
 RCT_EXPORT_VIEW_PROPERTY(onPanDrag, RCTBubblingEventBlock)
 RCT_EXPORT_VIEW_PROPERTY(onPress, RCTBubblingEventBlock)
 RCT_EXPORT_VIEW_PROPERTY(onLongPress, RCTBubblingEventBlock)
@@ -935,6 +936,11 @@ - (void)mapView:(AIRMap *)mapView didUpdateUserLocation:(MKUserLocation *)locati
 
 }
 
+- (void)mapView:(AIRMap *)mapView regionWillChangeAnimated:(BOOL)animated
+{
+    if (mapView.onRegionChangeStart) mapView.onRegionChangeStart(@{});
+}
+
 - (void)mapViewDidChangeVisibleRegion:(AIRMap *)mapView
 {
     [self _regionChanged:mapView];

src/MapView.tsx

@@ -419,6 +419,16 @@ export type MapViewProps = ViewProps & {
    */
   onPress?: (event: MapPressEvent) => void;
 
+  /**
+   * Callback that is called once before the region changes, such as when the user starts moving the map.
+   * `isGesture` property indicates if the move was from the user (true) or an animation (false).
+   * **Note**: `isGesture` is supported by Google Maps only.
+   *
+   * @platform iOS: Supported
+   * @platform Android: Supported
+   */
+  onRegionChangeStart?: (event: NativeSyntheticEvent<Details>) => void;
+
   /**
    * Callback that is called continuously when the region changes, such as when a user is dragging the map.
    * `isGesture` property indicates if the move was from the user (true) or an animation (false).