User Guide

Applying styles to custom components 145
The following ActionScript class file sets the color and borderColor styles of the
BlueButton control:
package myComponents
{
// as/myComponents/BlueButton.as
import mx.controls.Button;
public class BlueButton extends Button
{
public function BlueButton() {
super();
// Set the label text to blue.
setStyle("color", 0x0000FF);
// Set the borderColor to blue.
setStyle("borderColor", 0x0000FF);
}
}
}
The following MXML file uses the BlueButton control with the default color and
borderColor styles set in your component’s class file:
<?xml version="1.0"?>
<!-- as/MainBlueButton.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns:MyComps="myComponents.*">
<MyComps:BlueButton label="Submit"/>
</mx:Application>
Setting the styles in constructor does not prevent users of the component from changing the
style. For example, the user could still set their own value for the
color style, as the following
example shows:
<?xml version="1.0"?>
<!-- as/MainBlueButtonRed.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
xmlns:MyComps="myComponents.*">
<MyComps:BlueButton label="Submit" color="0xFF0000"/>
</mx:Application>