42
Chapter 2: Creating Basic Components in Flash MX 2004
13.
Right-click the component’s symbol in the Library and select Component Definition. In the
AS 2.0 Class field, enter the class name.
14.
Export the SWC file. For more information, see
“Creating SWC files” on page 18
.
15.
Add the new component to an MXML file and request that file to see the new skin.
If the skin is not positioned properly on the Stage, you can rearrange it by returning to the FLA
file and editing the skin’s symbol.
Creating compound components
Compound components are components that include the assets of multiple controls inside them.
They might be graphical assets or a combination of graphical assets and classes. For example, you
can create a component that includes a button and a text field, or a component that includes a
button, a text field, and a validator.
When you create compound components, you should instantiate the controls inside the
component’s class file. Assuming that some of these controls have graphical assets, you must plan
the layout of the controls that you are including, and set properties such as default values in your
class file. You must also ensure that you import all the necessary classes that the compound
component uses.
Since the class extends one of the base classes, such as mx.core.UIComponent, and not a controls
class like mx.controls.Button, you must instantiate each of the controls as children of the custom
component and arrange them on the screen.
Properties of the individual controls are not accessible from the MXML author’s environment
unless you design your class to allow this. For example, if you create a new component that
extends the UIComponent class and uses a Button and a TextArea component, you cannot set the
label text in the MXML tag because you do not directly extend the Button class.
To instantiate controls inside your compound component, use the
createClassObject()
method inside the
createChildren()
method. For more information, see
“Implementing the
createChildren() method” on page 54
.
This section uses an example component, called CompoundComponent, that combines a Button
control and a TextArea control. It handles the
click
event of the Button control and writes a
message to the TextArea control.
Since this component handles events (and doesn’t just emit them), it includes an event listener
and an event handler in the class file.
The
layoutChildren()
method handles the layout of the controls inside the component. This
method calls the control’s
move()
method to arrange the Button control centered below the
TextArea control. The values passed to the
move()
method are relative to the registration point in
the FLA file. This appears in the Flash Stage as a "+".
Another example of a compound component is ModalText, which uses a TextInput control and a
SimpleButton control. For more information, see
“Using the ModalText example” on page 73
.