Mega Code Archive
Use Transition to add and remove controls dynamically
<![CDATA[
<?xml version="1.0" ?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" backgroundColor="#FFFFFF">
<mx:transitions>
<mx:Transition fromState="" toState="Description">
<mx:Sequence target="{vbox1}">
<mx:Resize duration="500"/>
<mx:SetPropertyAction name="visible" target="{prodDesc}" value="true" startDelay="500"/>
</mx:Sequence>
</mx:Transition>
<mx:Transition fromState="Description" toState="">
<mx:Sequence target="{vbox1}">
<mx:SetPropertyAction name="visible" target="{prodDesc}" value="false" startDelay="500"/>
<mx:Resize duration="500"/>
</mx:Sequence>
</mx:Transition>
</mx:transitions>
<mx:states>
<mx:State name="Description">
<mx:AddChild relativeTo="{hbox1}" position="before">
<mx:TextArea width="200" height="180" id="prodDesc" borderStyle="none" visible="false" text="this is a test"/>
</mx:AddChild>
<mx:RemoveChild target="{descButton}"/>
<mx:AddChild relativeTo="{hbox1}" position="before">
<mx:Button label="Close Description" click="this.currentState=''"/>
</mx:AddChild>
</mx:State>
</mx:states>
<mx:VBox id="vbox1">
<mx:Label id="productNameTxt" text="Product Name" fontWeight="bold" />
<mx:Button label="Open Description" click="this.currentState='Description'" id="descButton"/>
<mx:HBox id="hbox1">
<mx:Button label="Add to Cart" id="addBtn"/>
</mx:HBox>
</mx:VBox>
</mx:Application>
]]>