Macromedia flex 2 Manual
Creating custom components
19
Creating custom components
You create custom components as either MXML or ActionScript files. This section contains
an overview of both methods.
an overview of both methods.
Creating MXML components
Flex supplies a
ComboBox
control that you can use as part of a form that collects address
information from a customer. In the form, you can include a ComboBox control to let the
user select the state portion of the address from a list of the 50 states in the U.S. In an
application that has multiple forms where a user can enter an address, it would be tedious to
create and initialize multiple ComboBox controls with the same information about all 50
states.
user select the state portion of the address from a list of the 50 states in the U.S. In an
application that has multiple forms where a user can enter an address, it would be tedious to
create and initialize multiple ComboBox controls with the same information about all 50
states.
Instead, you create an MXML component that contains a ComboBox control with all the 50
states defined within in it. Then, wherever you need to add a state selector to your
application, you use your custom MXML component. The following example shows a
possible definition for a custom ComboBox control:
states defined within in it. Then, wherever you need to add a state selector to your
application, you use your custom MXML component. The following example shows a
possible definition for a custom ComboBox control:
<?xml version="1.0"?>
<!-- intro\StateComboBox.mxml -->
<!-- intro\StateComboBox.mxml -->
<!-- Specify the root tag and namespace. -->
<mx:ComboBox xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:dataProvider>
<mx:String>AK</mx:String>
<mx:String>AL</mx:String>
<!-- Add all other states. -->
</mx:dataProvider>
</mx:ComboBox>
<mx:ComboBox xmlns:mx="http://www.adobe.com/2006/mxml">
<mx:dataProvider>
<mx:String>AK</mx:String>
<mx:String>AL</mx:String>
<!-- Add all other states. -->
</mx:dataProvider>
</mx:ComboBox>
This example shows the following:
1.
The first line of the custom MXML component definition specifies the declaration of the
XML version.
XML version.
2.
The first MXML tag of the component, called its root tag, specifies a Flex component or a
custom component. MXML components correspond to ActionScript classes, therefore, the
root tag specifies the superclass of the MXML component. In this example, the MXML
component specifies the Flex ComboBox control as its superclass.
custom component. MXML components correspond to ActionScript classes, therefore, the
root tag specifies the superclass of the MXML component. In this example, the MXML
component specifies the Flex ComboBox control as its superclass.
3.
The
xmlns
property in the root tag specifies the Flex XML namespace. In this example, the
xmlns
property indicates that tags in the MXML namespace use the prefix mx:.
4.
The remaining lines of the component specify its definition.