Using styles with the Button

A Button's styles generally specify values for a Button's skins, icons, text formatting, and padding when the component is drawn in its various states.

The following procedure puts two Buttons on the Stage and sets the emphasized property to true for both Buttons when the user clicks one of them. It also sets the emphasizedSkin style for the second Button to the selectedOverSkin style when the user clicks it so the two Buttons show different skins for the same state.

To change the emphasizedSkin style for a Button:

  1. Create a Flash file (ActionScript 3.0).
  2. Drag two Buttons to the Stage, one at a time, and give them instance names of aBtn and bBtn. In the Parameters tab of the Property inspector, give them labels of Button A and Button B.
  3. Add the following code to the Actions panel on Frame 1 of the Timeline:
    bBtn.emphasized = true;
    aBtn.emphasized = true;
    bBtn.addEventListener(MouseEvent.CLICK, Btn_handler);
    function Btn_handler(evt:MouseEvent):void {
        bBtn.setStyle("emphasizedSkin", "Button_selectedOverSkin");
    }
    
  4. Select Control > Test Movie.
  5. Click one of the buttons to see the effect of the emphasizedSkin style on each button.