Resizing and positioning buttons in Flash with ActionScript 3.0

The following example creates a Button instance, resizes it using the setSize() method and repositions it using the move() method.

Full code after the jump.

There are several methods and properties you can use to resize and reposition instances on the Stage. Resizing component instances can be done using one of two techniques: 1) setting the width and height properties, or 2) calling the setSize() method (inherited from fl.core.UIComponent). The setSize() method takes two parameters (width and height) and resizes the component accordingly. Using either one of these two techniques causes a resize event (represented by the fl.events.ComponentEvent.RESIZE constant) to be dispatched. By listening for this event, you can detect when a component instance has been resized and respond as needed. One benefit to using the setSize() method instead of the width and height properties is that the resize event is dispatched only once instead of twice (once for the width property and once for the height property).

In addition to setting a component’s x-coordinate and y-coordinate using their x and y properties, you can also reposition a component on the Stage using the move() method (which like the setSize() method, is inherited from the UIComponent class). Setting a component’s x property or y property, or calling the instance’s move() method, causes the component to dispatch a move event (represented by the fl.events.ComponentEvent.MOVE constant).

// ActionScript 3.0
import fl.controls.Button;
 
var myButton:Button = new Button();
myButton.label = "Click me";
myButton.setSize(120, 40);
myButton.move(10, 10);
addChild(myButton);

The following example creates a new Button instance and listens for its resize and move events to be dispatched:

// ActionScript 3.0
// Import the required component classes.  
import fl.controls.Button;
import fl.events.ComponentEvent;
 
// Create a new TextField object, and add it to the display list. 
var myTextField:TextField = new TextField();
myTextField.autoSize = TextFieldAutoSize.LEFT;
myTextField.multiline = true;
myTextField.text = "";
myTextField.x = 140;
myTextField.y = 10;
addChild(myTextField);
 
/* Create a new Button component instance, add listeners for the move and 
   resize events, and add it to the display list. */
var myButton:Button = new Button();
myButton.label = "Click me";
myButton.addEventListener(ComponentEvent.RESIZE, resizeHandler);
myButton.addEventListener(ComponentEvent.MOVE, moveHandler);
myButton.setSize(120, 40);
myButton.move(10, 10);
addChild(myButton);
 
/* Handler function for the Button component instance. This function appends 
   text to the text field after the button was resized. */
function resizeHandler(evt:ComponentEvent):void {
    var btn:Button = evt.currentTarget as Button;
    myTextField.appendText("component was resized. w:" + btn.width + ", h:" + btn.height + "\n");
}
 
/* Handler function for the Button component instance. This function appends
   text to the text field after the button was moved. */
function moveHandler(evt:ComponentEvent):void {
    var btn:Button = evt.currentTarget as Button;
    myTextField.appendText("component was moved. x:" + btn.x + ", y:" + btn.y + "\n");
}

For more information on the Flash/ActionScript 3.0 Button component, see the “Using the Button component” Flash Quick Start on Adobe.com.