Setting a Button control’s icon and label position in Flash with ActionScript 3.0

by Peter deHaan on November 26, 2008

in Button

In a previous entry, “Setting icons on the Button component with Flash and ActionScript 3.0″, we saw how to add an icon to a Button component instance by setting the icon style. You can use the labelPosition property to position the button’s label relative to the icon.

The following example demonstrates the four possible values for the labelPosition property, using the constants from the ButtonLabelPosition class (fl.controls.ButtonLabelPosition). This example requires a symbol in your Flash document’s library with a linkage class of AdobeLogo.

Full code after the jump.

// ActionScript 3.0
// Import the required component classes.
import fl.controls.Button;
import fl.controls.ButtonLabelPlacement;
 
/* Create a new Button component instance, set the icon style to the AdobeLogo
   linkage in the library, set the labelPlacement property to "left", and add 
   the button to the display list. */
var buttonLeft:Button = new Button();
buttonLeft.label = "ButtonLabelPlacement.LEFT";
buttonLeft.labelPlacement = ButtonLabelPlacement.LEFT;
buttonLeft.setStyle("icon", AdobeLogo);
buttonLeft.setSize(200, 60);
buttonLeft.move(10, 10);
addChild(buttonLeft);
 
/* Create a new Button component instance, set the icon style to the AdobeLogo
   linkage in the library, set the labelPlacement property to "right", and add 
   the button to the display list. */
var buttonRight:Button = new Button();
buttonRight.label = "ButtonLabelPlacement.RIGHT";
buttonRight.labelPlacement = ButtonLabelPlacement.RIGHT;
buttonRight.setStyle("icon", AdobeLogo);
buttonRight.setSize(200, 60);
buttonRight.move(10, 80);
addChild(buttonRight);
 
/* Create a new Button component instance, set the icon style to the AdobeLogo
   linkage in the library, set the labelPlacement property to "top", and add 
   the button to the display list. */
var buttonTop:Button = new Button();
buttonTop.label = "ButtonLabelPlacement.TOP";
buttonTop.labelPlacement = ButtonLabelPlacement.TOP;
buttonTop.setStyle("icon", AdobeLogo);
buttonTop.setSize(200, 60);
buttonTop.move(10, 150);
addChild(buttonTop);
 
/* Create a new Button component instance, set the icon style to the AdobeLogo
   linkage in the library, set the labelPlacement property to "bottom", and add 
   the button to the display list. */
var buttonBottom:Button = new Button();
buttonBottom.label = "ButtonLabelPlacement.BOTTOM";
buttonBottom.labelPlacement = ButtonLabelPlacement.BOTTOM;
buttonBottom.setStyle("icon", AdobeLogo);
buttonBottom.setSize(200, 60);
buttonBottom.move(10, 220);
addChild(buttonBottom);

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

{ 0 comments… add one now }

Leave a Comment

You can use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="">

Previous post:

Next post: