Adobe FLEX 2 - CREATING AND EXTENDING COMPONENTS Manual page 16

Customizing existing Flex components
One reason for you to create a component is to customize an existing Flex component for
your application requirements. This customization could be as simple as setting the
label
property of a Button control to Submit to create a custom button for all of your forms.
You might also want to modify the behavior of a Flex component. For example, a VBox
container lays out its children from the top of the container to the bottom in the order in
which you define the children within the container. Instead, you might want to customize the
VBox container to lay out its children from bottom to top.
Another reason to customize a Flex component is to add logic or behavior to it. For example,
you might want to modify the TextInput control so that it supports a key combination to
delete all the text entered into the control. Or, you might want to modify a component so that
it dispatches a new event type when a user action.
To create your own components, you create subclasses from the UIComponent class, or any
other class in the Flex component hierarchy. For example, if you want to create a component
that behaves almost the same as a Button component does, you can extend the Button class
instead of recreating all the functionality of the Button class from the base classes.
Depending on the modifications that you want to make, you can create a subclass of a Flex
component in MXML or ActionScript.
The relationship between MXML components and
ActionScript components
To create a custom component in ActionScript, you create a subclass from a class in the Flex
class hierarchy. The name of your class (for example, MyASButton), must correspond to the
name of the ActionScript file; for example, MyASButton.as. The subclass inherits all of the
properties and methods of the superclass. In this example, you use the tag to
<MyASButton>
reference it in MXML.
When you create a custom component in MXML, the Flex compiler automatically creates an
ActionScript class. The name of the MXML file (for example, MyMXMLButton.mxml)
corresponds to the ActionScript class name. In this example, the ActionScript class is named
MyMXMLButton, and you use the tag to reference it in MXML.
<MyMXMLButton>
16 Creating Flex Components