Home Tutorial Flex Flex-components Creating Custom Component using MXML

Creating Custom Component using MXML
Posted on: April 12, 2010 at 12:00 AM

Creating custom components in flex can be performed by two ways. You can customize the component either uusing MXML only or Action Script only or using combination of both

Creating Custom Component using MXML

Creating custom components in flex can be performed by two ways. You can customize the component either uusing MXML only or Action Script only or using combination of both. MXML can be used for simple custom components like combining multiple components and make a useful component whereas the action script can be used for complex components.

Below is the example of making custom textinput component. Create mxml file in mycomp package and write code like below:

MyMXMLCustomComponent.mxml

<?xml version="1.0" encoding="utf-8"?>

<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="400" height="300">

<mx:TextInput textAlign="left" color="green"/>

</mx:Canvas>

You can use the above component in another mxml file by setting the mxlns property to the custom component. Here MyComp refers to the any component in mycomp package.

<?xml version="1.0" encoding="utf-8"?>

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"

layout="absolute"

xmlns:MyComp="mycomp.*">

<MyComp:MyMXMLCustomComponent/>

</mx:Application>

See the output below. Type some text in the input box, you will see green text inside the box.

Related Tags for Creating Custom Component using MXML:

«Previous Index Next»

Ask Questions?

If you are facing any programming issue, such as compilation errors or not able to find the code you are looking for.

Ask your questions, our development team will try to give answers to your questions.

Tutorial Topics