« Dashed Lined Charts | Main | Flex 2 Remoting »
January 29, 2006
Adding Dynamic UI Elements
Hello!
After a long hiatus, I have returned to the Flex blog-o-sphere. I won't torture anyone with the long story where I go MaD; er, I mean I went and worked in Adobe's Mobile and Device division. Suffice it to say I have enough frequent flyer miles to last for a while. Nevertheless, I'm back now, working on Flex 2.
I've been working on some applications and I wanted to post some information you might find useful. One technique I use for building dynamic UIs is to add child components programmatically. The way to do this is to use the addChild method (this works in both AS 2 and AS 3) on a container -- that can either have content in it already or it could be empty.
Below is some simple code that adds a custom component to an HBox:
DynamicComponent.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.macromedia.com/2005/mxml" xmlns="*" backgroundColor="white">
<mx:Script>
<![CDATA[
public function createBarsToo() {
myHBox.addChild(new CustomComponent());
}
]]>
</mx:Script>
<mx:HBox id="myHBox" horizontalGap="3" backgroundColor="red" width="150" height="50"/>
<mx:Button id="myButtonToo" click="createBarsToo()" label="Create Component"/>
</mx:Application>
CustomComponent.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.macromedia.com/2005/mxml" xmlns="*" backgroundColor="blue" cornerRadius="5" width="1" borderStyle="inset" height="50">
</mx:Canvas>
Posted by eanderson at January 29, 2006 04:50 AM