Flex 2 Developer's Guide > Building User Interfaces for Flex Applications > Using Flex Visual Components > Extending components

Extending components

Flex 2 SDK provides several ways for you to extend existing components or to create components. By extending a component, you can add new properties or methods to it.

For example, the following MXML component, defined in the file MyComboBox.mxml, extends the standard ComboBox control to initialize it with the postal abbreviations of the states in New England:

<?xml version="1.0"?>
<!-- components\myComponents\MyComboBox.mxml -->
<mx:ComboBox xmlns:mx="http://www.adobe.com/2006/mxml">
    <mx:dataProvider>
        <mx:String>CT</mx:String>
        <mx:String>MA</mx:String>
        <mx:String>ME</mx:String>
        <mx:String>NH</mx:String>
        <mx:String>RI</mx:String>
        <mx:String>VT</mx:String>
    </mx:dataProvider>
</mx:ComboBox>

This example also shows how the MXML compiler lets you use some coding shortcuts. Flex expects the dataProvider to be an array, so you do not have to specify a <mx:Array> tag.

After you create it, you can use your new component anywhere in your application by specifying its filename as its MXML tag name, as the following example shows:

<?xml version="1.0"?>
<!-- components\MainMyComboBox.mxml -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
    xmlns:MyComps="myComponents.*"
    width="150" 
    height="150">

    <MyComps:MyComboBox id="stateNames"/>
</mx:Application>

In this example, the new component is in the same directory as your application file, and maps the local namespace, indicated by the asterisk (*), to the MyComps identifier.

Flex lets you create custom components using either of the following methods. The method you choose depends on your application and the requirements of your component.

• Create components as MXML files and use them as custom tags in other MXML files. MXML components provide an easy way to extend an existing component, particularly to modify the behavior of an existing component or add a basic feature to an existing component.
• Create components as ActionScript files by subclassing the UIComponent class or any of its subclasses, and use the resulting classes as custom tags. ActionScript components provide a powerful tool for creating new visual or nonvisual components.

For detailed information on creating custom components, see Creating and Extending Flex 2 Components.

Flex 2.01