"Animating" circle overlay with circle renderer on map view flickers - ios

Question

I need to change radius of my MKCircle continuously as user pinches on the screen. As its radius property is read-only, I am removing and recreating the circle and the renderer continuously, which, I believe, causes "flickering" effect when user pinches. It continuously appears/disappears when "animating" which looks really bad visually, creating a crappy UX. Here is my code:
//this method may be called many times a second.
-(void)refreshRadius{ //called when user pinches after updating to correct radius.
if(radiusCircle){
[self.mapView removeOverlay:radiusCircle];
}
radiusCircle = [MKCircle circleWithCenterCoordinate:userCoordinates radius:radius];
[self.mapView addOverlay:radiusCircle level:MKOverlayLevelAboveLabels];
}
-(MKOverlayRenderer *)mapView:(MKMapView *)mapView rendererForOverlay:(id<MKOverlay>)overlay{
if(overlay == radiusCircle){
MKCircleRenderer *renderer = [[MKCircleRenderer alloc] initWithCircle:radiusCircle];
renderer.strokeColor = [UIColor colorWithWhite:1 alpha:0.5];
renderer.lineWidth = 0.8;
renderer.fillColor = [UIColor colorWithRed:0.3 green:0.36 blue:0.7 alpha:0.2];
return renderer;
}else{
return nil;
}
}
How can I "animate" the radius smoothly on scale?

Answer 1

After a bit experimenting, I've luckily found a solution. However, while it works perfectly now, it's prone to future internal changes in iOS SDK. I've first set the read-only property "radius" using KVC. Then, I've invalidated my renderer's path, causing it to redraw itself immediately using the new radius. It is not the most-smooth-60FPS-animation-ever but it works really nicely. Here is the code:
[radiusCircle setValue:#(radius) forKey:#"radius"];
[renderer invalidatePath];
radiusCircle is my MKCircle instance, and renderer is my circle renderer. It works.