Saturday, 17 October 2009

Button component in Actionscript 3 – part 2

This is a continuation of the previous post on the button component in Actionscript 3.0. In this post I will go into more detail about the button component. For each of the parts below you will need to have the button component in the library by selecting Windows > Components and dragging the component into the library.


1. Dynamically create button component instance

The first example will dynamically create a button instance on the stage. You need to have the component in the library panel.

//Imports the Button Class.
import fl.controls.Button;

//This creates a new instance of a button and adds it to the display
//list using the addChild() method.
var my_Button:Button = new Button();
addChild(my_Button);

You should now have a button in the top left corner like below.




2.Setting button position and size

The second example will move the button anywhere on the stage using the move() method. This method sets the x & y coordinates of the component. The setSize() method changes the size of the component by adjusting the width and height properties.
//Imports the Button Class.
import fl.controls.Button;

//This creates a new instance of a button.
var my_Button:Button = new Button();

//Sets the position and size of component.
my_Button.move(20, 20);
my_Button.setSize(100, 50);

//Adds the component to the display list using the addChild() method.
addChild(my_Button);

You should get the following result. The button has move to (20,20) on the stage and has a width of 100px and a height of 50px.




3.Change button label

The third example will change the text in the button component using the label property.
import fl.controls.Button;

var my_Button:Button = new Button();
my_Button.move(20, 20);
my_Button.setSize(100, 50);

my_Button.label = "ilike2flash";

addChild(my_Button);

Your button should now have the label “ilike2flash”.




4.Add actions to Buttons

The fourth example will add actions to the button by using an eventlistener method with a click event.
import fl.controls.Button;

var my_Button:Button = new Button();

my_Button.move(20, 20);
my_Button.setSize(100, 50);
my_Button.label = "ilike2flash";

//Adds the click event to the button.
my_Button.addEventListener(MouseEvent.CLICK, myClick);

addChild(my_Button);

//Function outputs the message hit when the button is clicked.
function myClick(event:MouseEvent):void {
trace("Hit!");
}
Part 3 – Coming soon.

2 comments:

popflier 5 November 2009 at 16:28  

I understand how to dynamically add or use the component to add buttons, but it seems that no one explains how to make it so you can add a URL or load a SWF when your button is actually clicked. In AS2 I could easily use the On(Release) statement and simply say, gotoandplay, gotoURL, or loadMovieClip, but with as3 it's so different and I don't understand how to tell my button to do any of these things either using the component or by dynamically creating the button. How did you tell your button to go to the Photobucket URL?

iliketo 6 November 2009 at 02:55  

@popflier

This is very easy. Firstly, take a look at example 4 in the above tutorial. Then look at the Open URL in AS3

  COPYRIGHT © 2014 · ILIKE2FLASH · Theme by Ourblogtemplates

Back to TOP