2

I working on app that relate with map and polyline. I want to animate color changing of polyline what I have to do to achieve this.

I search to properly method all days yesterday and decide to ask question today.

Something like this code do but do on MKPolyline:

//Assume that this view is a line shape.
UIView *view = [[UIView alloc] init];
view.frame = CGRectMake(50, 50, 100, 5);
view.backgroundColor = [UIColor redColor];
[self.view addSubview:view];

[UIView animateWithDuration:0.5f animations:^{
    view.backgroundColor = [UIColor greenColor];
}];

So far I have:

Subclass of MKPolylineRenderer

- (void)drawMapRect:(MKMapRect)mapRect zoomScale:(MKZoomScale)zoomScale inContext:(CGContextRef)context {
    CGFloat baseWidth = self.lineWidth / zoomScale;
    CGContextSetAlpha(context, 0.5);
    CGContextAddPath(context, self.path);
    CGContextSetStrokeColorWithColor(context, self.strokeColor.CGColor);
    CGContextSetLineWidth(context, baseWidth * 4);
    CGContextSetLineCap(context, self.lineCap);
    CGContextStrokePath(context);
    [super drawMapRect:mapRect zoomScale:zoomScale inContext:context];
}

In viewController.m

Adding polyline

- (void)addPolylineToMap {
    CustomPolyline *polyline = [CustomPolyline polylineWithCoordinates:coordinates count:[coordinateArray count]];
    polyline.lineID = polylineID;
    [mapView addOverlay:polyline level:MKOverlayLevelAboveRoads];
}

Changing polyline color (Thanks to Anna #Ref:MKPolyline / MKPolylineRenderer changing color without remove it)

- (void)changingPolylineColor {
    for (MKPolyline *overlays in [mapView overlays]) {
        if ([overlays isKindOfClass:[CustomPolyline class]]) {
            CustomPolylineRenderer *renderer = (CustomPolylineRenderer *)[mapView rendererForOverlay:overlays];
            renderer.strokeColor = [self getColorFromArrayWithLineID:[(CustomPolyline *)overlays lineID]];
            [renderer invalidatePath];
        }
    }
}

MapViewDelegate renderForOverlay:

- (MKOverlayRenderer *)mapView:(MKMapView *)mapView rendererForOverlay:(id<MKOverlay>)overlay {
    if ([overlay isKindOfClass:[CustomPolyline class]]) {
        polylineView = [[CustomPolylineRenderer alloc] initWithPolyline:overlay];
        polylineView.strokeColor = [self getColorFromArrayWithLineID:[(CustomPolyline *)overlay lineID]];
        polylineView.alpha = 0.5f;
        polylineView.lineWidth = 4.0f;
        return polylineView;
    }
    return nil;
}

So what I need is when I call [self changingPolylineColor]; the polyline on map has change color with animation.

Thank you in advance.

Community
  • 1
  • 1
majorl3oat
  • 4,327
  • 1
  • 18
  • 21

0 Answers0