调整 iOS 自定义 Marker 的实现

1. Overlay 使用原有的实现，didUpdateReactSubviews 并不能带来实际作用
2. 拖拽时变回大头针，是因为 MAPinAnnotationView 内部机制问题，resetImage 并不能真正的解决问题。对于自定义 marker，应该使用 MAAnnotationView。

ios/AMapMarker.h

@@ -8,11 +8,11 @@
 @property(nonatomic, copy) RCTBubblingEventBlock onDragStart;
 @property(nonatomic, copy) RCTBubblingEventBlock onDrag;
 @property(nonatomic, copy) RCTBubblingEventBlock onDragEnd;
+@property(nonatomic, assign) BOOL dragging;
 
 - (CLLocationCoordinate2D)coordinate;
 - (NSString *)title;
 - (NSString *)subtitle;
-- (void)resetImage;
 
 - (BOOL)active;
 - (MAAnnotationView *)annotationView;

ios/AMapMarker.m

@@ -3,24 +3,18 @@
 #pragma ide diagnostic ignored "OCUnusedMethodInspection"
 
 @implementation AMapMarker {
-    MAPinAnnotationView *_annotationView;
+    MAAnnotationView *_annotationView;
     MAPointAnnotation *_annotation;
-    AMapOverlay *_overlay;
+    AMapOverlay *_marker;
     AMapOverlay *_callout;
     AMapView *_mapView;
     BOOL _active;
-    UIImage *_image;
-    CGPoint _centerOffset;
-    CGPoint _calloutOffset;
-}
-
-- (instancetype)init {
-    self = [super init];
-    _annotation = [MAPointAnnotation new];
-    _annotationView = [[MAPinAnnotationView alloc] initWithAnnotation:_annotation reuseIdentifier:nil];
-    _annotationView.canShowCallout = YES;
-
-    return self;
+    NSString *_title;
+    NSString *_subtitle;
+    CLLocationCoordinate2D _coordinate;
+    MAPinAnnotationColor _pinColor;
+    BOOL _draggable;
+    NSInteger _zIndex;
 }
 
 - (MAAnnotationView *)annotationView {
@@ -28,29 +22,27 @@
 }
 
 - (NSString *)title {
-    return _annotation.title;
+    return _title;
 }
 
 - (NSString *)subtitle {
-    return _annotation.subtitle;
+    return _subtitle;
 }
 
 - (CLLocationCoordinate2D)coordinate {
-    return _annotation.coordinate;
+    return _coordinate;
 }
 
 - (void)setCoordinate:(CLLocationCoordinate2D)coordinate {
+    _coordinate = coordinate;
     _annotation.coordinate = coordinate;
 }
 
 - (void)setTitle:(NSString *)title {
+    _title = title;
     _annotation.title = title;
 }
 
-- (void)setSubtitle:(NSString *)subtitle {
-    _annotation.subtitle = subtitle;
-}
-
 - (void)setActive:(BOOL)active {
     _active = active;
     if (active) {
@@ -60,22 +52,18 @@
     }
 }
 
-- (void)resetImage {
-    if (_image) {
-        _annotationView.image = _image;
-        _annotationView.centerOffset = _centerOffset;
-    }
-}
-
 - (void)setIcon:(MAPinAnnotationColor)color {
-    _annotationView.pinColor = color;
+    _pinColor = color;
+    ((MAPinAnnotationView *) _annotationView).pinColor = color;
 }
 
 - (void)setDescription:(NSString *)description {
-    _annotationView.annotation.subtitle = description;
+    _subtitle = description;
+    _annotation.subtitle = description;
 }
 
 - (void)setDraggable:(BOOL)draggable {
+    _draggable = draggable;
     _annotationView.draggable = draggable;
 }
 
@@ -84,6 +72,7 @@
 }
 
 - (void)setZIndex:(NSInteger)zIndex {
+    _zIndex = zIndex;
     _annotationView.zIndex = zIndex;
 }
 
@@ -96,54 +85,54 @@
 }
 
 - (void)insertReactSubview:(id <RCTComponent>)subview atIndex:(NSInteger)atIndex {
-    if ([subview isKindOfClass:[AMapOverlay class]]) {
     if (atIndex == 0) {
-            _overlay = (AMapOverlay *) subview;
-            _overlay.delegate = self;
-            _annotationView.image = nil;
-            _image = nil;
+        _annotation = [MAPointAnnotation new];
+        _annotation.coordinate = _coordinate;
+        _annotation.title = _title;
+        _annotation.subtitle = _subtitle;
+
+        if ([subview isKindOfClass:[AMapOverlay class]]) {
+            _marker = (AMapOverlay *) subview;
+            _marker.delegate = self;
+            _annotationView = [[MAAnnotationView alloc] initWithAnnotation:_annotation reuseIdentifier:nil];
+        } else {
+            _annotationView = [[MAPinAnnotationView alloc] initWithAnnotation:_annotation reuseIdentifier:nil];
+            ((MAPinAnnotationView *) _annotationView).pinColor = _pinColor;
         }
-        if (atIndex == 1) {
-            // TODO: customCalloutView 的位置不太对
-            _callout = (AMapOverlay *) subview;
 
-            // f**king amap only support button as callout, so below it is.
-            // more funny thing is callout offset shown right when using button. unbelievable!!!
+        _annotationView.canShowCallout = YES;
+        _annotationView.draggable = _draggable;
+        _annotationView.zIndex = _zIndex;
+    } else if (atIndex == 1 && [subview isKindOfClass:[AMapOverlay class]]) {
+        _callout = (AMapOverlay *) subview;
         _callout.delegate = self;
+
         UIButton *button = [[UIButton alloc] initWithFrame:CGRectZero];
-            [button addSubview:(UIView *) subview];
+        [button addSubview:_callout];
 
         _annotationView.customCalloutView = [[MACustomCalloutView alloc] initWithCustomView:button];
     }
-    }
 }
 
 #pragma mark AMapOverlayDelegate
 
 - (void)update:(AMapOverlay *)overlay {
-    if (overlay == _overlay) {
-        dispatch_async(dispatch_get_main_queue(), ^{
-            UIGraphicsBeginImageContextWithOptions([_overlay bounds].size, NO, 0.0f);
-            [_overlay.layer renderInContext:UIGraphicsGetCurrentContext()];
-            UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
-            UIGraphicsEndImageContext();
-            _annotationView.image = image;
-            
-            _image = image;
-        });
+    if (self.dragging) {
+        return;
     }
-}
 
-- (void)updateLayout:(AMapOverlay *)overlay {
     CGFloat width = CGRectGetWidth(overlay.bounds);
     CGFloat height = CGRectGetHeight(overlay.bounds);
 
-    if (overlay == _overlay) {
-        // change default image center
-        _centerOffset = CGPointMake(0, -height / 2);
-        _annotationView.centerOffset = _centerOffset;
+    if (overlay == _marker) {
+        UIGraphicsBeginImageContextWithOptions([_marker bounds].size, NO, 0.0f);
+        [_marker.layer renderInContext:UIGraphicsGetCurrentContext()];
+        UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
+        UIGraphicsEndImageContext();
+
+        _annotationView.image = image;
+        _annotationView.centerOffset = CGPointMake(0, -height / 2);
     } else if (overlay == _callout) {
-        // change default callout offset
         _annotationView.customCalloutView.bounds = CGRectMake(0, 0, width, height);
     }
 }

ios/AMapOverlay.h

@@ -5,10 +5,9 @@
 @protocol AMapOverlayDelegate <NSObject>
 @optional
 - (void)update:(AMapOverlay *)overlay;
-- (void)updateLayout:(AMapOverlay *)overlay;
 @end
 
 @interface AMapOverlay : RCTView
-@property(nonatomic, strong) id<AMapOverlayDelegate> delegate;
+@property(nonatomic, strong) id <AMapOverlayDelegate> delegate;
 - (void)update;
 @end

ios/AMapOverlay.m

 #import "AMapOverlay.h"
-#import <React/UIView+React.h>
 
 @implementation AMapOverlay {
 }
 
 - (void)update {
     [self.delegate update:self];
-    
-    [self.delegate updateLayout:self];
-}
-
-- (void)didUpdateReactSubviews {
-    [super didUpdateReactSubviews];
-    
-    [self update];
 }
 
 @end

ios/AMapOverlayManager.m

@@ -9,7 +9,7 @@
 @implementation AMapOverlayManager {
 }
 
-RCT_EXPORT_MODULE(AMapOverlay)
+RCT_EXPORT_MODULE()
 
 - (UIView *)view {
     return [AMapOverlay new];
@@ -20,7 +20,6 @@ RCT_EXPORT_METHOD(update:(nonnull NSNumber *)reactTag) {
         id view = viewRegistry[reactTag];
         [(AMapOverlay *) view update];
     }];
-
 }
 
 @end

ios/AMapViewManager.m

-#import <React/RCTViewManager.h>
 #import <React/RCTUIManager.h>
 #import "AMapView.h"
 #import "AMapMarker.h"
@@ -135,21 +134,22 @@ RCT_EXPORT_METHOD(animateTo:(nonnull NSNumber *)reactTag data:(NSArray *)data) {
 - (void)mapView:(MAMapView *)mapView annotationView:(MAAnnotationView *)view didChangeDragState:(MAAnnotationViewDragState)newState
    fromOldState:(MAAnnotationViewDragState)oldState {
     AMapMarker *marker = (AMapMarker *) view.annotation;
+    marker.dragging = NO;
     if (newState == MAAnnotationViewDragStateStarting && marker.onDragStart) {
         marker.onDragStart(@{});
     }
-    if (newState == MAAnnotationViewDragStateDragging && marker.onDrag) {
+    if (newState == MAAnnotationViewDragStateDragging) {
+        marker.dragging = YES;
+        if (marker.onDrag) {
             marker.onDrag(@{});
         }
+    }
     if (newState == MAAnnotationViewDragStateEnding && marker.onDragEnd) {
         marker.onDragEnd(@{
                 @"latitude": @(marker.coordinate.latitude),
                 @"longitude": @(marker.coordinate.longitude),
         });
     }
-    if (newState == MAAnnotationViewDragStateCanceling || newState == MAAnnotationViewDragStateEnding) {
-        [marker resetImage];
-    }
 }
 
 @end