Qondio
Front
Intel
IntelMart
Shares
My Qondio
Account
Gordon French > Intel > Flash CS3 Tutorial, Dynamically Create a Button

qondio.com/VbrI PRINT EMAIL

Flash CS3 Tutorial, Dynamically Create a Button

Creating a Dynamic Button
FLash CS3 Tutorial, Using ActionScript to Create a Button
For This Flash CS3 Tutorial the will not be any starting files. You do not need any images or objects in the library. In this Flash CS3 Tutorial the button will be completely created using ActionScript. Start by opening a new Flash CS3 file, ActionScript 3.0. Select the first key frame and press F9 to open the actions panel. When creating a button one needs to define all the states of the button before anything else can be done. Add the example code to the actions panel.

var btn1up:Shape = new Shape();
btn1up.graphics.beginFill(0x00000)
btn1up.graphics.drawCircle(475, 200, 20)

First, the ActionScript defines the variable btn1up, defines it as a shape and then creates a new shape called btn1up. The fill color is then defined as black(0x00000). Last the btn1up shape is drawn as a circle starting at an x location of 475, a y position of 200, and for a total size of 20px. You can play with all these values as you need. The up state of your new button has been defined..

Copy the next section of code and paste it below the existing code. This section of code is going to define the over state of your button. This is basically the exact same code. Notice that the color has been changed so that the user will see that your shape is actually a button.

var btn1over:Shape = new Shape();
btn1over.graphics.beginFill(0x762512)
btn1over.graphics.drawCircle(475, 200, 20)

Yes this is getting repetitive, but you have to define each of the states. So, again copy and past the example code below the existing code in the actions panel. This code simple defines the Hit state of your button.

var btn1hit:Shape = new Shape();
btn1hit.graphics.beginFill(0x00000)
btn1hit.graphics.drawCircle(475, 200, 20)

Finally, something new. The previous code created the shapes for the button, but now the button actually needs to be created. So copy the example code into the actions panel. This line of ActionScript simply creates a variable called your_btn sets it as a SimpleButton and then creates a new button. However, nothing has connected the new button to the shapes previously created.

var your_btn:SimpleButton = new SimpleButton();

Each shape needs to be defined as a state of the button, so add the example code. This code is pretty straight forward.

var btn1hit:Shape = new Shape();
btn1hit.graphics.beginFill(0x00000)
btn1hit.graphics.drawCircle(475, 200, 20)

Since the button doesn't exist on the stage, remember it was drawn with ActionScript, it needs to be something to tell it to go to the stage. That's where the addChild method comes in. The example code is simply telling Flash to add your_btn to the stage.

stage.addChild(your_btn);

Last you just need to add an event listener to the button, just as you would any other button. Your set. This event listener simple traces when the button is clicked, but you can make it do anything.

your_btn.addEventListener(MouseEvent.CLICK, size1);
function size1(event:MouseEvent):void{
trace("clicked")
}

Press Control-Enter and test you movie.

External Links

List of Flash Tutorials | This Tutorial with Source Files

Contributed by Gordon French on May 15, 2008, at 2:42 PM UTC.

PLEASE VISIT THE CONTRIBUTOR'S WEBSITE
FrenchSquared
Website dedicated to Flash Tutorials
FrenchSquared.com

Reactions

No reactions yet.

Rate This Intel

Please login or sign up to rate this intel.

Comments

Please login or sign up to add a comment.

Share

Copyright Notice

The copyright for this content entitled "Flash CS3 Tutorial, Dynamically Create a Button" has been specified by the contributor as:

All Rights Reserved

This content may not be copied, distributed or adapted by anyone under any circumstances.

Login Here with
Any Email Address
Any Password
No account? Sign up.

Intel Contributor
This intel was contributed by Gordon French


Gordon French

Qondio Archive
May, 2012
123456
78910111213
14151617181920
21222324252627
28293031


2008
January, February, March, April, May, June, July, August, September, October, November, December
2009
January, February, March, April, May, June, July, August, September, October, November, December
2010
January, February, March, April, May, June, July, August, September, October, November, December
2011
January, February, March, April, May, June, July, August, September, October, November, December
2012
January, February, March, April, May

Sign Up
Not a member yet? Qondio is a powerful network for making it online. If you have a website to promote, we can help. Sign up and get in on the action.

About Qondio
Welcome to Qondio! Discover the awesome power this network can deliver by going to our About page. Or you could skip straight to the Sign Up form.

ABOUT
SUCCESS GUIDE
FEATURES
FAQ
ADVERTISE
CONTACT
USAGE POLICY
PRIVACY POLICY


TWITTER
FACEBOOK