Animate multiple shapes in UIView

Question

I have a custom class that inherit from UIView. In the draw method I draw several shapes including some circles. I want to animate the color (now stroke color) of the circles independent of each other, eg I would like the color of one or more the circles to "pulse" or flash (using ease-in/ease-out and not linearly).

What would be the best way to archive this?

It would be great to be able to use the built-in animation code (CABasicAnimation and the like) but I'm not sure how?

EDIT: Here's the code involved. (I am using Xamarin.iOS but my question is not specific to this).

    CGColor[] circleColors;

    public override void Draw (RectangleF rect)
    {
        base.Draw (rect);
        using (CGContext g = UIGraphics.GetCurrentContext ()) {
            g.SetLineWidth(4);
            float size = rect.Width > rect.Height ? rect.Height : rect.Width;
            float xCenter = ((rect.Width - size) / 2) + (size/2);
            float yCenter = ((rect.Height - size) / 2) + (size/2);
            float d = size / (rws.NumCircles*2+2);
            var circleRect = new RectangleF (xCenter, yCenter, 0, 0);
            for (int i = 0; i < rws.NumCircles; i++) {
                circleRect.X -= d;
                circleRect.Y -= d;
                circleRect.Width += d*2;
                circleRect.Height += d*2;
                CGPath path = new CGPath ();
                path.AddEllipseInRect (circleRect);
                g.SetStrokeColor (circleColors [i]);
                g.AddPath (path);
                g.StrokePath ();
            }
        }
    }

Answer 1

You need to move all your drawing code to a subclass of CALayer , and decide parameters which, once varied, will produce the desired animations. Convert these parameters to the layer's properties, and you can animate the layer's properties with CABasicAnimation (or even [UIView animateXXX] ).

See this SO question for more information.

Make sure that you set the layer's rasterizationScale to [UIScreen mainScreen].scale to avoid blurs on Retina.