在MKMapView上绘制自定义形状（Geofences）区域

Question

我正在创建一个Universal app，我必须在map view上创建自定义安全区域。

我所做的是：

1. 添加一个新的UIView作为map view的超级视图，称为squareZone。
2. 在squareZone视图中，我添加UIPanGestureRecognizer，UIPinchGestureRecognizer和UIRotationGestureRecognizer，这样我就可以移动，旋转和缩放（进出）。

这是SquareZone的代码

- (id)initWithFrame:(CGRect)frame{
    self = [super initWithFrame:frame];
    if (self) {
        self.opaque = NO;
        self.layer.cornerRadius = 5.0f;
    }
    return self;
}

- (void)drawRect:(CGRect)rect {
    [super drawRect:rect];

    UIColor *color = [UIColor colorWithRed: 0.765 green: 0.439 blue: 0.443 alpha: 0.658];

    UIBezierPath *rectanglePath = [UIBezierPath bezierPathWithRect: rect];
    [color setFill];
    [rectanglePath fill];
    [UIColor.whiteColor setStroke];
    rectanglePath.lineWidth = 5;
    CGFloat rectanglePattern[] = {2, 3};
    [rectanglePath setLineDash: rectanglePattern count: 2 phase: 0];
    [rectanglePath stroke];
}

现在，当用户调整squareZone时，我必须在UILabel上显示每个点之间的距离，以米为单位。对于我正在使用的任务

- (CLLocationDistance)distanceFromLocation:(const CLLocation *)location

当用户与UILabels交互时，如何添加/显示四个squareZone。

我需要一些亮点。我见过很多教程，但我无法想象这怎么可能。作为参考，有一个叫做的应用程序

Trax：https://itunes.apple.com/us/app/trax-gps-tracker/id647170688?mt=8

我必须做同样的绘图地理围栏区。

提前致谢。

Answer 1

首先要提到的是Trax有两种不同的模式：

1）editing - 你画的路径

2）live - 显示结果的地方。

编辑模式

在editing中，您无法移动和缩放MKMapView内部。发生这种情况是因为他们使用的方法和你一样 - 他们在UIView上添加了一个MKMapView，这样手势就不会相互冲突。

您需要做的就是将CGPoints添加到某个阵列并在将来使用它们。

当然，使用CoreGraphics框架有一些困难，但它并不是那么棘手。

现场模式

在用户添加了所有CGPoints后，您现在必须将这些点转换为实际的CLLocationCoordinate2D实例。

CGPoint thePoint = ...
CLLocationCoordinate2D theLocationCoordinate2D = [theMapView convertPoint:thePoint toCoordinateFromView:theDrawingView];

Trax在他们的应用程序中有什么（几乎可以肯定）MKPolygon类的实例。

您可以像这样添加它：

NSUInteger theCount = self.theMainDrawingView.thePointsArray.count;
CLLocationCoordinate2D theLocationCoordinatesArray[theCount];
for (NSUInteger theIndex = 0; theIndex < theCount; theIndex++)
{
    CGPoint thePoint = self.theMainDrawingView.thePointsArray[theIndex].CGPointValue;
    CLLocationCoordinate2D theLocationCoordinate2D = [self.theMainMapView convertPoint:thePoint toCoordinateFromView:self.theMainDrawingView];
    theLocationCoordinatesArray[theIndex] = theLocationCoordinate2D;
}
MKPolygon *thePolygon = [MKPolygon polygonWithCoordinates:theLocationCoordinatesArray count:theCount];
[self.theMainMapView addOverlay:thePolygon];

但是，这不是结束。这将触发你的MKMapView的委托方法（不要忘记设置其.delegate属性）

- (MKOverlayView *)mapView:(MKMapView *)mapView viewForOverlay:(id<MKOverlay>)overlay
{
    if (![overlay isKindOfClass:[MKPolygon class]])
    {
        return nil;
    }
    MKPolygonView *thePolygonView = [[MKPolygonView alloc] initWithPolygon:(MKPolygon *)overlay];
    thePolygonView.fillColor = [[UIColor cyanColor] colorWithAlphaComponent:0.2];
    thePolygonView.strokeColor = [[UIColor redColor] colorWithAlphaComponent:0.6];
    thePolygonView.lineWidth = 4;
    return thePolygonView;
}

结果如下所示：

示例项目

Download the sample project from here

摘要

当然，这并没有完全解决问题，因为你也必须添加pinch和pan手势，但我希望我能指出正确的方向。