Create Flash animation how?

Question

I now the basics of flash. I can make images transparrent and tween etc. I want to create an animation (like this one), if someone can please help put me in the correct direction? I am not sure how to get the circles animated to get the next image to display. Thank you in advance.

Answer 1

Elementary!

So basically there are two elements at work here - there is the background image, and there is the animated mask. There are a few ways you can do it - the simplest way is to just do it on the timeline.

Store all the images you want to use, one on each frame, in a MovieClip (we'll call it "ImagesClip").

You only need three layers, the current background image will appear in an ImagesClip on the bottom-most layer. The next background image will appear in an ImagesClip on a layer above, and it will be masked by (on the third, topmost layer) a mask layer which will hold the circle animation.

The mask layer is where all the magic happens. It will be empty on the first frame, some frames later a small circle will grow (just use a "shape tween") to a larger circle (in the middle of the background image), and other circles will appear and revolve around the center circle. That is how the animation works.

To make the carousel effect (cycling through the images ad infinitum), you need to do the following to start each animation:

function start_animation(index:uint):void
{
   var previous_index:int = (index - 1);
   if (previous_index < 0) previous_index = num_images - 1;
   current_images_clip.gotoAndStop(previous_index);
   next_images_clip.gotoAndStop(index);
   // Assumes that next_images_clip_mask is empty on the first frame.
   next_images_clip_mask.gotoAndPlay(0);
}

And to cycle through programmatically, you can just use a Timer, where start_animation is the callback to the TIMER event (but if you do that, you'll have to track the current_index in a variable, and change the parameter to start_animation to event:TimerEvent, naturally).