Wednesday, February 21, 2007

Complex Button RollOver/RollOut Effects woth flash MX

Complex Button RollOver/RollOut Effects
by warhero : 24 April 2005
It seems everywhere you look now has some form of complex button. Most buttons that have an animation when rolled over and an animation when you roll out are done with some form of this concept that I intend to share with you.

If you understand basic Flash concepts and just a smidgen of Actionscript, you will catch on in no time.

Here is How

Create a new Flash document.

Open up the document properties by pressing ctrl+j (cmd+j on Mac) and change the stage size to 100x100. Change the Frame Rate to 30.

Rename layer 1 on the main timeline to complexButton. The main timeline should now look like this:




Create a new movieclip by pressing ctrl+F8 (cmd+F8 on Mac). Name it mc_complex.

Double click mc_complex in the library to edit the symbol. Select the Oval Tool(o) and make a 30x30 circle on the stage. In the properties panel set the x and y values for that circle to 0.

Double click the circle to select the Fill and Stroke. Press F8 to convert it to a symbol so we can tween it. Make it into a graphic symbol and name it gr_circle






Still editing the mc_complex movieclip select frame 15 and press F6. This inserts a keyframe. Resize the circle a little bigger than what is there. I went with 40x40.

Right click on any frame between the two keyframes on the timeline and select Create Motion Tween.

Create a new layer and call it actions. Insert a blank keyframe(F7) on frame 15. The timeline for mc_complex should now look like this

1 Comment:

Anonymous said...

Where's the rest of it?! I need to know how to roll out, not just do motion tweens!!