Creating a fanning out core animation

Question

I'd like to create an animation that starts with the appearance of a small circle then progresses like this:

• 2nd larger circle appears
• 3rd larger circle appears
• 1st smallest circle disappears
• 4 larger circle appears
• 2nd circle disappears

and on to probably six or so circles.

Circles will fades in/out. Each larger circle encloses the smaller circle before it. This is the same type of animation you might see in instructional screencast. The instructor clicks something and where the click occurs, there is an animation that speads out and fades as circles get wider. Similar to dropping a pebble into a pond.

I could probably do this with several UIImageViews and a timer. But is there a better way?

Answer 1

I'm hardly a Core Animation expert, but check out UIView +beginAnimations:context:

You can animate changes in alpha for a view like this (assume the view starts with an alpha of 1):

[UIView beginAnimations:@"Fadeout" context:nil]
myview.alpha = 0;
[UIView commitAnimations]

This is called an animation block. Anything you change in there, if animation is supported for that view property, will slowly change from whatever it was before to whatere you specify there. In the case of alpha, that will cause the view to fade from alpha of 1 to alpha of 0 (at which point it's invisible).

There are methods to set the animation duration, the delay before the animation begins, and you can also nest these animation blocks.

So, I think you can do this with nested animation blocks and UIImageViews containing circles with transparent backgrounds or something similar. Whether that's the optimal way to do it I'm not sure, but that's a way that should work. See the UIView documentation for all the animation methods.

Answer 2

Why can't you use UIImageView with array of images and animate?