Animated map overlay: How do I make an MKCircle expand from 0 to its full size when it gets added?

585 views Asked by At

I would like to have my MKCircle expand from 0 to its specified radius size whenever it gets added to the map. MKOverlayRenderer is getting me a nice end result, but it adds the circle too spontaneously. I would like to animate it to have a smoother entrance, but I don't know how to do it without animation layers.

I have tried adding an expanding UIView with a CABasicAnimation and replacing it with an overlay on completion, but the code is ugly and there is a noticeable flicker when the overlay gets added.

I've looked at two other projects claiming to have animated overlays, but neither of them are the silver bullet I'm looking for.

  • http://yickhong-ios.blogspot.com/2012/04/animated-circle-on-mkmapview.html Back in 2012 this guy subclassed MKCircleView, which apparently is deprecated/strongly discouraged.
  • https://github.com/jhurray/iOS7AnimatedMapOverlay This guy subclasses UIImageView, adds a circle png, and adds some CABasicAnimations to make it expand and fade. He then adds this image view to the map whenever an annotation gets selected. The animation works fine, but whenever the region starts changing, the animation gets removed, and is only added again when the region is done changing. It is not a functioning overlay that redraws on region changes. All he has is an MKCircle set to nil with a comment telling you "change it" if you want an overlay. I could possibly "change it" to add the overlay when the UIImageView is done expanding, but something tells me it would produce the same flickery result as my UIView workaround.

There's another approach I'm considering that I'm not too sure about (because I've never tried to produce animation effects from Core Graphics alone), and that is subclassing MKOverlayRenderer, setting the custom drawing (of MKCircle?) in - (void)drawMapRect: to width and height x = 0, and using an NSTimer to increment x and call setNeedsDisplayInMapRect until the circle has reached its full size. It sounds like kind of a long shot to me, and there may be an easier way to do this.

I need someone to point me in the right direction on this one.

0

There are 0 answers