…and especially enthusiastic about motion tweens in Flash…
You might have created movie clip buttons in Flash CS3 or Flash CS4 (or Flash 8 or 7 or…) before to get those animations on your buttons. Either way, creating one would have proceeded a bit like the following if you used ActionScript 2.0.
* Create a button, and give it an instance name (in the following case, myMc).
* Along the Timeline, add frame labels _up, _over, _down, and _hit (if you want a hit area for the button).
* Put stop actions at each frame label, and change the graphics and/or add some animation at each state.
* Add this code to frame 1 in the actions panel:
myMC.onRelease = function() { trace ("You clicked me."); }
(For full instructions on creating a movie clip button, you can refer to something I wrote for docs waaay back in Flash 8 days here updated for CS3).
More after the jump.
So anyway, you can use frame labels to tell that playhead what to do in a movie clip, and Flash automagically turns your movie clip into a button that you just write normal button code for and everything just works. And thus it can be pretty useful - you don’t have to write any code to tell the playhead where to go on a timeline, Flash will do the work for you based on the correctly named frame labels. You may have tried the same in ActionScript 3.0, and it didn’t work (surprise! or not…)
So for AS3, you need to add an additional line of code, buttonMode = true. Set up your button the same way as the steps above, use graphics on your _up, _over (etc) keyframes, make sure your publish settings are ActionScript 3.0, and add this code on the Timeline instead:
myMC.buttonMode = true; myMC.addEventListener(MouseEvent.CLICK, onClick); function onClick(evt:MouseEvent):void { trace("you clicked me"); }
Then you have a movie clip button, AS3 style.
Note: If you use movie clips inside of your button (instead of graphics), you need to set mouseEnabled to false for the instances. For example, put your_mc.mouseEnabled = false; on the _up, _over (etc) frames.
Another button post on this blog. Yeesh. Whatever - I’m clicking Publish.
MORE INFORMATION ON BUTTONS:
This blog specializes in the new motion model of Flash CS4, and is brought to you by team tween of Flash at Adobe. The blog will includes tips, techniques, and info on tweening in Flash using the Timeline and Motion Editor (as well as some stuff about motion runtime with code). From time to time, we might also talk about ActionScript 3.0. So if you're interested in tweens, this blog is for you. We also want to hear your feedback in the comments. All views expressed here are those of the authors, and do not necessarily represent the opinion or views of Adobe Systems Inc.

Jonathan
October 20th, 2008 at 7:46 am
This will help a little with as3 with setting up buttons:
Steven Sacks
October 20th, 2008 at 9:25 am
http://www.stevensacks.net/2008/02/01/using-jsfl-to-create-auto-buttons-in-flash/
:)
Jen deHaan
October 20th, 2008 at 9:37 am
Sweet JSFL!!
wilson
December 5th, 2008 at 11:59 am
hello,
I saw your tutorial in adobe.com video section (banner). i like the tutor it was so clear. can you please make one tutorial on how to create preloader ?
thanks,
Wilson
Jen deHaan
December 5th, 2008 at 9:51 pm
@Wilson. Thanks! Will see what I can do! I can certainly do a blog entry for something like that, at the very least.
Àlex
January 7th, 2009 at 7:16 am
@Wilson & Jen
In the meantime, you can check Lee Brimelow’s video tutorial ‘Preloading in ActionScript 3′:
http://www.gotoandlearn.com/play?id=85
Best regards ;)
Bojan
January 16th, 2009 at 4:14 am
I think that AS3 is overcomplicated, as far as this all action-to-button thing concerned… And by the way, it’s pain in the “behind” that you have to learn new AS in every 2 years…
Justin Roberts
January 25th, 2009 at 9:30 pm
Dear Jen,
do you have a tutorial on creating a simple button menu - that when you click on a thumbnail, a larger image of the thumb appears on the stage right next to the menu?
cheers,
justin
da.Jenny
February 20th, 2009 at 3:09 pm
Jeeeeeennnn!
I survive by your tutorials. BUT
importing swf file to dreamweaver makes my site load forever (15sec!) in the browser. I started with flash so my pages would load faster, better, sexier and so on. Now it takes longer than without flash. I google the problem and everyone seems to have that issue- swf file embedded in dreamweaver takes forever to load in the ultimate browser- but nobody has an answer. YET??
Thank you,
Jenny
online dizi izle
March 14th, 2009 at 8:08 am
Sweet JSFL!!
movies
April 18th, 2009 at 5:47 am
great ,i will test it,and Put stop actions at each frame label, and change the graphics and/or add some animation at each state to my site!
philip
April 19th, 2009 at 9:09 pm
so if one puts your code in after following your linked directions to m aking a button is the code before or after the stop command in as2? because it isn’t working for me for some reason. thanks
kripa
April 30th, 2009 at 8:11 am
I’m a complete newbie..
I’m trying to create a shape object, convert it into a movie clip symbol. Now I want the shape to get dragged when I press the mouse button and when I release the mouse button, i want the object to be dropped, I tried multiple tutorials to get this program, but none of them are working on CS4 flash 10 with action script 3.0! Any tutorials on how to do this.
tOnic
April 30th, 2009 at 12:34 pm
Hi Jen, all,
I’m having difficulty with the second half of step 4 (”Put stop actions at each frame label, and change the graphics and/or add some animation at each state.”)
I can’t wrape my mind around how to add animation at each state. for instance, I want an “over” state to gradually change its tint from the “up” state as the cursor moves over the button.
how do I do that? do I make a movie clip of the tint change and embed it within the frame of the “over” state? that hasn’t worked (the button refuses to function at all)
cheers
FlashSpec
May 19th, 2009 at 1:49 pm
tOnic, just make the transition of tint in the timeline of button, name the first frame of the over state “over”, on last frame of the over state put “stop()” actionscript.
Here’s some flash of mine: http://bit.ly/CtVgv - http://bit.ly/10Th0S
Alyosha
June 16th, 2009 at 10:58 pm
Hey guys, I just started to learn about flash scripting and bumped into this nice page.
I have no problems making attractive buttons by first doing the animation work in after effects and then importing and assembling it in flash.
But what I do have problems with is finding out how to make a button animation play out until it finishes and not stop immediately after mouse over even is o longer active, for example.
Or for example I would like user to click on button to start animation, but delay the link activation until animation play out.
I have scoured the web to no avail, or I maybe just dont understand scripting in as3 enough, my guess is itshould not be that hard:-)
I would be grateful is someone pointed me in the right direction, either a tut or a hint on how to script the thing to work in the described manner.
Many thanks,
matilda
September 22nd, 2009 at 1:12 pm
HELP!!!
PLEASE:)
Hello,
I need help with some actionscript!;)
my slideshow is almost workin but i am getting an error message saying:
1084: Syntax error: expecting rightparen before SimpleButton.
Here is what my code looks like:
stop();
//next button
SimpleButton.addEventListener(next_btn.onPress=function(){
if(studio_art1._currentframe==studio_art1._totalframes){
studio_art1.gotoAndStop(1)
}else{
studio_art1.nextFrame()
}
}
//last button
SimpleButton.addEventListener(back_btn.onPress=function(){
if(studio_art1._currentframe==1){
studio_art1.gotoAndStop(studio_art1._totalframes)
}else{
studio_art1.prevFrame()
}
}
Braddley
September 25th, 2009 at 9:10 am
Hi Jen,
Thanks for the help. When I put the _over on the frame label it works perfectly. but when i roll off, the rollover stays up. any thoughts?
Thanks!
Kurt
December 22nd, 2009 at 3:28 pm
I am a Noob to Flash and am having problems getting some movieclips to link to different URLs on release. I am able to get them to animate, and I am able to get them to link to an html page in the same folder, but I can’t get both functionalities to work at the same time and it is driving me crazy!! I’ve tried putting the actionscript in the instance object, in the action layer, and other things and nothing seems to work!?
Here is the link to the source file: http://www.myfavorites.com/flashtest/header_v8_122209_v2.fla
I believe that the actionscripting needs to be done in the “baners” movieclip, but it could also be the “Symbol 3″ movieclip. I’m not sure and this is where I also need help.
Here is also a link to the .swf (http://www.myfavorites.com/flashtest/header_v8_122209_v2.swf). See, if you mouse over the first two clips, they animate, but they do not go to the HTML page if you click on them (http://www.myfavorites.com/flashtest/success1.html). The third clip will go to the page success1.html in the same folder if you click on it, but it does not animate on mouse over.
I’m using Flash CS3 as my editor and I’m using ActionScript 2.0 for the scripting.
Any help you can provide on this is most appreciated!! I’m normally pretty good at figuring out things on my own, but This problem is driving me crazy!!