Custom Events

MainApplication
<?xml version=”1.0″ encoding=”utf-8″?>
<mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml” layout=”absolute” creationComplete=”init()”>
<mx:Script>
<![CDATA[
import event.Customevent;
private function init():void
{
this.addEventListener(Customevent.CUSTOM_EVENT,customHandler);
}
private function customHandler(e:Customevent):void
{
dat1.text=e.data1;
dat2.text=e.data2;
}
private function dispatchClick():void
{
bt.dispatchEvent(new Customevent("custom",new Object(),"iam data1","iam data2"));
}
]]>
</mx:Script>
<mx:Panel x=”131″ y=”69″ width=”250″ height=”200″ layout=”absolute”>
<mx:Text x=”83″ y=”30″ text=”Text” id=”dat1″/>
<mx:Label x=”40″ y=”30″ text=”Data1″ />
<mx:Text x=”83″ y=”56″ text=”Text” id=”dat2″/>
<mx:Label x=”40″ y=”56″ text=”Data2″/>
<mx:Button id=”bt” x=”73″ y=”100″ label=”Dispatch” click=”dispatchClick()”/>
</mx:Panel>
</mx:Application>

CustomEvent.as
package event
{
import flash.events.Event;

public class Customevent extends Event
{
public var ob:Object;
public function Customevent(type:String,passOb:Object,passData1:String,passData2:String)
{
ob=passOb;
data1=passData1;
data2=passData2;
super(type, true, false);
}
public static const CUSTOM_EVENT:String=”custom”;
public var data1:String;
public var data2:String;
}
}

In the main application when u click the dispatch button it will dispatch the customEvent which passes the customEvent Class object in to the event flow then the application which handles that event will call the handler function which populates the text with the passed data

This will be usefull when one component wants to pass data to other component after some event.

Forming Hierarchial Data

<![CDATA[
// import com.render.TreeRender;
import mx.collections.HierarchicalData;
import mx.collections.ArrayCollection;
// import com.model.SettingModel;
// import com.manager.ConnectionConstants;

import mx.controls.Alert;
private var responder:Responder;
[Bindable]
private var result:ArrayCollection=new ArrayCollection();
// public var settingModel:SettingModel=SettingModel.getInstance();
private var childPresent:Boolean=false;
private var result2:ArrayCollection=new ArrayCollection();

public function init():void
{
// getSection();
result2.addItem({section_id:23,ref_section_id:13,name:"Abotus1",children:new Array()});
result2.addItem({section_id:24,ref_section_id:23,name:"Abotus2",children:new Array()});
result2.addItem({section_id:89,ref_section_id:10,name:"Terns2",children:new Array()});
result2.addItem({section_id:19,ref_section_id:3,name:"Contact",children:new Array()});
result2.addItem({section_id:14,ref_section_id:12,name:"Businewss",children:new Array()});
result2.addItem({section_id:13,ref_section_id:12,name:"Abotus",children:new Array()});
result2.addItem({section_id:12,ref_section_id:3,name:"Corporate",children:new Array()});
result2.addItem({section_id:11,ref_section_id:20,name:"Disclaimer",children:new Array()});
result2.addItem({section_id:10,ref_section_id:20,name:"Terns",children:new Array()});
result2.addItem({section_id:9,ref_section_id:20,name:"policy",children:new Array()});
result2.addItem({section_id:8,ref_section_id:3,name:"Release",children:new Array()});
result2.addItem({section_id:21,ref_section_id:null,name:"Music",children:new Array()});
result2.addItem({section_id:22,ref_section_id:null,name:"Blog",children:new Array()});
result2.addItem({section_id:3,ref_section_id:null,name:"Music",children:new Array()});
result2.addItem({section_id:2,ref_section_id:null,name:"Home",children:new Array()});
result2.addItem({section_id:20,ref_section_id:3,name:"Policy",children:new Array()});

/* result.addItem({section_id:2,ref_section_id:null,name:"Home",children:new Array()});
result.addItem({section_id:3,ref_section_id:null,name:"ThinkMusic",children:new Array()});
result.addItem({section_id:22,ref_section_id:null,name:"Blog",children:new Array()});
result.addItem({section_id:21,ref_section_id:null,name:"Music",children:new Array()});
result.addItem({section_id:8,ref_section_id:3,name:"Press Release",children:new Array()});
result.addItem({section_id:20,ref_section_id:3,name:"Policy",children:new Array()});
result.addItem({section_id:9,ref_section_id:20,name:"Privacy policy",children:new Array()});
result.addItem({section_id:10,ref_section_id:20,name:"Terns",children:new Array()});
result.addItem({section_id:11,ref_section_id:20,name:"Disclaimer",children:new Array()});
result.addItem({section_id:12,ref_section_id:3,name:"Corporate",children:new Array()});
result.addItem({section_id:13,ref_section_id:12,name:"Abotus",children:new Array()});
result.addItem({section_id:14,ref_section_id:12,name:"Businewss",children:new Array()});
result.addItem({section_id:19,ref_section_id:3,name:"Contact",children:new Array()});*/
filter1();
// formTree();
}

public function getSection():void
{
responder=new Responder(onGetResult,onFault);
// settingModel.connManager.call(ConnectionConstants.cmsBackEndClass+"."+ConnectionConstants.getAllSectionMethod,responder);
}
private function addClick():void
{

}
public function onGetResult(e:Object):void
{
result2.removeAll();
for(var i:int=0;i<e.length;i++)
{
var arr:Array=new Array();
result2.addItem({name:e[i].name,children:arr,description:e[i].description,flag:e[i].flag,ref_section_id:e[i].ref_section_id
,section_id:e[i].section_id,sequence:e[i].sequence,type:e[i].type});
}
filter1();

//formTree();
}
public function filter1():void
{
result.removeAll();
for(var i:int=0;i<result2.length;i++)
{
if(result2[i].ref_section_id!=null)
{
if(!childPresentOrnotresult2(result2[i].section_id))
{
result.addItem(result2[i]);
result2.removeItemAt(i);
i–;
}
}
}

for(i=0;i<result2.length;i++)
{
result.addItem(result2[i]);
}
formTree();
}
public function formTree():void
{
var j:int=0;
var count:int=0;
var lastId:int=0;
var refId:int=0;
for(var i:int=0;i<result.length;i++)
{
if(result[i].ref_section_id!=null)
{
lastId=chkForChilds(result[i].section_id);
refId=getRef(lastId);
var index:int=getSectionIndex(refId);
}
else
{
continue;
}
if(index!=-1)
{
for(var z:int=0;z0)
index–;
count++;
}
}

}
}
if(count!=0)
{
i–;
count=0;
}
}
for(i=0;i<result.length;i++)
{
if(result[i].ref_section_id==null)
{
j++;
}
}
if(j!=result.length)
formTree();
// settingModel.lastSectionSeq=j;
var hr:HierarchicalData=new HierarchicalData();
hr.source=result;
settingTree.dataProvider=hr;
settingTree.validateNow();
// settingTree.expandAll();
}
public function getSectionIndex(id:int):int
{
for(var i:int=0;i<result.length;i++)
{
if(result[i].section_id==id)
{
return i;
}
}
return -1;
}
public function getRef(id:int):int
{
for(var i:int=0;i<result.length;i++)
{
if(id==result[i].section_id)
{
return result[i].ref_section_id;
}
}
return 0;
}
public function onFault():void
{
Alert.show("Fault in Section service");
}
public function chkForChilds(id:int):int
{
var inP:int=0;
childPresent=false;
for(var j:int=0;j<result.length;j++)
{
if(result[j].ref_section_id!=null)
{
if(id==result[j].ref_section_id)
{

inP=result[j].section_id;
childPresent=true;
chkForChilds(result[j].section_id);
}

}
}
if(!childPresent)
{
return id;
}
else
return inP;
}
public function childPresentOrnot(id:int):Boolean
{
for(var j:int=0;j<result.length;j++)
{
if(id==result[j].ref_section_id)
{
return true;
}
}
return false;
}
public function childPresentOrnotresult2(id:int):Boolean
{
for(var j:int=0;j<result2.length;j++)
{
if(id==result2[j].ref_section_id)
{
return true;
}
}
return false;
}
public function removeChilds(id:int):void
{
for(var i:int=0;i<result.length;i++)
{
if(id==result[i].section_id)
{
result.removeItemAt(i);
break;
}
}
}

In the above component result2 array we have section id and refrence section id in each element,refrence section id is the section id of another element which indicates the parent node so here refsection id indicates the parent sectionid,with this we have to form a tree structure.

Here is how i have done .

First i have rearranged the array and formed anew array so that all childs appear first in the array then at topmost appears.The topmost
parents have refsectionid null .

Then we are taking the section id of first element and finding the whether it has any childs and chkforchilds() method will return the last child section id.from the last child section id we are taking the refrence id of the last child which is the parent and attach all nodes with that refsection id to the parent if the node is not having child and the node is removed from the result array

this continues tilll the topmost elements alone left in the array.

Preview :http://www.box.net/shared/bofeauioku

Flex and amf php

step 1:
download http://sourceforge.net/projects/amfphp/files/#files amf php and extract the contents to the root folder of the server
step 2:
create a php class file as followed and store it in services folder of the amf php u downloaded
php

class test
{
public __construct()
{
your database connection code goes here
}
function insert($param)
{
return mysql_query(“insert into test(param)values(‘$param’)”);
}
}
save the file with name as same as class name
step 3:

now in ur mxml do the following code

Mxml

import flash.net.*;

private var gw:NetConnection=new NetConnection()
private var amfRes:Responder=new Responder(onResult,onFault);

private function init():void
{
gw.connect(“amfphp url here”);
}
private function callPhpInsert():void
{
gw.call(“phpPackage.phpclass.phpmethod”,amfRes,param);
}

private function onResult(e:object):void
{

}
private function onFault(e:object):void
{

}

step 4:
now run the application

the value param will be inserted to the specified table “test”

In this Code what we have done is created a netconnection gateway
and connected the gateway using the connect method to amfphp

then calling the php insert method using the call method of gw with the responder to handle the result

the resull of the method will be handled inside the onResult method that is defined in the responder

Dynamic Form In Flex

<?xml version=”1.0″ encoding=”utf-8″?>
<mx:Application xmlns:mx=”http://www.adobe.com/2006/mxml” layout=”absolute” creationComplete=”init()”>
<mx:Style>

</mx:Style>
<mx:Script>
<![CDATA[
import mx.events.IndexChangedEvent;
import mx.controls.Text;
import mx.effects.WipeDown;
import mx.effects.WipeUp;
import mx.collections.ArrayCollection;
import mx.events.EffectEvent;
import mx.effects.Resize;
import mx.effects.Move;
import mx.controls.Alert;
public var mo:Move=new Move();
[Bindable]
public var redata:Array=new Array();
public var selob:Array=new Array();
public var nwob:Array=new Array();
public var repda:Array=new Array();
public var addctl:Array=new Array();
public var caddctl:Array=new Array();
public var faddctl:Array=new Array();
public var count:int=new int();
public var fcount:int=new int();
public var ccount:int=new int();
public var cli:int=new int();
public var style:CSSStyleDeclaration = new CSSStyleDeclaration();
[Bindable]
public var arrc:ArrayCollection=new ArrayCollection(repda);
public var mco:int=new int();
private function rep(event:Event):void
{
if(cli==0)
{
hre.visible=true;
cli++;
}
else if(cli==1)
{
hre0.visible=true;
cli++;
}
else if(cli==2)
{
hre3.visible=true;
cli++;
}
event.currentTarget.visible=false;

}
private function inlisten():void
{
plus.addEventListener(MouseEvent.CLICK,rep);
plus0.addEventListener(MouseEvent.CLICK,rep);
plus1.addEventListener(MouseEvent.CLICK,rep);
plus2.addEventListener(MouseEvent.CLICK,rep);
}
private function init():void
{
tab.addEventListener(IndexChangedEvent.CHANGE,chng);
style.setStyle( “fontWeight”, “bold” );
style.setStyle( “text-transform”, “capitalize” );
StyleManager.setStyleDeclaration( “Text”, style, false );
addre.addEventListener(MouseEvent.CLICK,add);
addnw.addEventListener(MouseEvent.CLICK,adnw);
min.addEventListener(MouseEvent.CLICK,mini);
var eff:WipeUp=new WipeUp()
eff.xFrom=10;
eff.yFrom=664;
eff.yTo=26;
eff.target=perpa;
eff.duration=2000;
eff.play();
}
private function chng(event:IndexChangedEvent):void
{
if(tab.selectedIndex==2)
{
var ftre:Resize=new Resize();
ftre.target=tab;
ftre.widthTo=809;
ftre.heightTo=411;
ftre.play();
var fre:Resize=new Resize();
fre.target=perpa;
fre.widthTo=876;
fre.play();
}
else
{

remin();

}
}
private function mini(event:Event):void
{

var cmo:Move=new Move();
cmo.xTo=653;
cmo.yTo=0;
cmo.target=cpan;
cmo.addEventListener(EffectEvent.EFFECT_END,eff);
cmo.play();
var cre:Resize=new Resize();
cre.heightFrom=493;
cre.heightTo=66;
cre.widthTo=371;
cre.target=cpan;
cre.play();

}
private function adnw(event:Event):void
{
var x:int=44;
var y:int=30;
var ycou:int=0;
var cycou:int=0;
var fycou:int=0;
if(typ.selectedIndex==0)
{
var hc:HBox=new HBox();
var nt:Text=new Text();
var nti:TextInput=new TextInput() ;
hc.width=230;
nt.width=110;
nt.text=nwtex.text;
nti.width=110;
hc.addChild(nt);
hc.addEventListener(KeyboardEvent.KEY_DOWN,del);
hc.label=nwtex.text;
if(count==0)
{
hc.x=10;
hc.y=338;

}
else
{
hc.x=addctl[count-1].x+x;
ycou++;

if(ycou!=0)
{
hc.y=addctl[count-1].y+y;
hc.x=10;
ycou=0;
}
}
hc.addChild(nti);
pcan.addChild(hc);
addctl.push(hc);
count++;

}
else if(typ.selectedIndex==1)
{

var chc:HBox=new HBox();
var cnt:Text=new Text();
var cnti:TextInput=new TextInput() ;
chc.addEventListener(KeyboardEvent.KEY_DOWN,del);
chc.label=nwtex.text;
cnt.width=120;
cnt.text=nwtex.text;
cnti.width=110;
chc.addChild(cnt);
chc.addEventListener(KeyboardEvent.KEY_DOWN,del);
if(ccount==0)
{
chc.x=10;
chc.y=345;

}
else
{
chc.x=caddctl[ccount-1].x+x;
cycou++;
if(cycou!=0)
{
chc.y=caddctl[ccount-1].y+y;
chc.x=10;
cycou=0;
}
}
chc.addChild(cnti);
ccan.addChild(chc);
caddctl.push(chc);
ccount++;

}
else if(typ.selectedIndex==2)
{

Alert.show(typ.selectedIndex.toString());
var fhc:HBox=new HBox();
var fnt:Text=new Text();
var fnti:TextInput=new TextInput() ;
fhc.addEventListener(KeyboardEvent.KEY_DOWN,del);
fhc.label=nwtex.text;
fnt.width=50;
fnt.text=nwtex.text;
fnti.width=100;
fhc.addEventListener(KeyboardEvent.KEY_DOWN,del);
fhc.addChild(fnt);
if(fcount==0)
{
fhc.x=10;
fhc.y=420;
fcount++;
}
else
{
fhc.x=faddctl[fcount-1].x+x;
fycou++;
if(fycou!=0)
{
fhc.y=faddctl[fcount-1].y+y;
fhc.x=10;
fycou=0;
}
}
fhc.addChild(fnti);
fcan.addChild(fhc);
faddctl.push(fhc);
ccount++;

}

}
private function add(event:Event):void
{
selob[li.selectedIndex].visible=true;
redata.splice(li.selectedIndex,1);
li.dataProvider=redata;
if(redata.length==0)
{
while(selob.length!=0)
selob.pop();
}

}
private function del(event:KeyboardEvent):void
{
if(event.keyCode.toString()==”46″)
{
event.currentTarget.visible=false;
selob.push(event.currentTarget);
redata.push(event.currentTarget.label);
li.dataProvider=redata;
}

}
private function remin():void
{
var re:Resize=new Resize();
re.target=perpa;
re.widthTo=588;
re.play();
var tre:Resize=new Resize();
tre.target=tab;
tre.widthTo=533;
tre.heightTo=411;
tre.play();

}
private function eff(event:EffectEvent):void
{
if(mco==0)
{
remin();
var rz:Resize=new Resize();
rz.heightTo=500;
rz.widthTo=371;
rz.target=cpan;
rz.play();
mco++;
}
else if(mco>0)
{
var rre:Resize=new Resize();
rre.target=perpa;
rre.widthTo=876;
rre.play();
var rtre:Resize=new Resize();
rtre.target=tab;
rtre.widthTo=809;
rtre.heightTo=411;
rtre.play();
mco=0;
}
}
private function movef():void
{
mo.target=cpan;
mo.xTo=620;
mo.yTo=21;
mo.addEventListener(EffectEvent.EFFECT_END,eff);
mo.play();
}
]]>
</mx:Script>
<mx:MenuBar id=”myMenuBar” labelField=”@label” enabled=”false”>
<mx:XMLList>
<menuitem label=”Home”>
<menuitem label=”SubMenuItem A-1″ enabled=”true”/>
<menuitem label=”SubMenuItem A-2″/>
</menuitem>
<menuitem label=”MenuItem B”/>
<menuitem label=”MenuItem C”/>
<menuitem label=”MenuItem D”>
<menuitem label=”SubMenuItem D-1″
type=”radio” groupName=”one”/>
<menuitem label=”SubMenuItem D-2″
type=”radio” groupName=”one”
selected=”true”/>
<menuitem label=”SubMenuItem D-3″
type=”radio” groupName=”one”/>
</menuitem>
</mx:XMLList>
</mx:MenuBar>

<mx:Panel  id=”perpa” x=”10″ y=”40″ width=”876″ height=”497″ layout=”absolute” title=”USER DETAILS” buttonMode=”true”>
<mx:TabNavigator  id=”tab” x=”25″ y=”30″ width=”809″ height=”411″ horizontalAlign=”left”>
<mx:Canvas id=”pcan” label=”PERSONAL DETAILS” width=”100%” height=”100%”>
<mx:Text x=”10″ y=”44″ text=”NAME*” width=”48″ fontWeight=”bold”/>
<mx:TextInput x=”119″ y=”40″ width=”122″/>
<mx:Text x=”119″ y=”14″ text=”First name”/>
<mx:TextInput x=”249″ y=”40″ width=”113″/>
<mx:Text x=”249″ y=”14″ text=”Middle name”/>
<mx:TextInput x=”370″ y=”40″ width=”129″/>
<mx:Text x=”370″ y=”14″ text=”Last name”/>
<mx:Text x=”12″ y=”72″ text=”D.O.B*” fontWeight=”bold”/>
<mx:DateField x=”119″ y=”70″ width=”100″/>
<mx:ComboBox x=”119″ y=”106″ width=”100″>
<mx:ArrayCollection>
<mx:String>Single</mx:String>
<mx:String>Married</mx:String>
</mx:ArrayCollection>
</mx:ComboBox>
<mx:Text x=”10″ y=”108″ text=”MARITAL STATUS” fontWeight=”bold”/>
<mx:Text x=”10″ y=”148″ text=”SEX” fontWeight=”bold”/>
<mx:ComboBox x=”119″ y=”146″ width=”100″>
<mx:ArrayCollection>
<mx:String>Male</mx:String>
<mx:String>Female</mx:String>
</mx:ArrayCollection>
</mx:ComboBox>
<mx:Text text=”ADDRESS” fontWeight=”bold” x=”249″ y=”74″/>
<mx:TextArea x=”328″ y=”73″ width=”151″ height=”71″/>
<mx:Text x=”251″ y=”242″ text=”PIN” fontWeight=”bold”/>
<mx:TextInput x=”328″ y=”240″ width=”151″/>
<mx:TextInput x=”328″ y=”157″ width=”151″/>
<mx:TextInput x=”328″ y=”212″ width=”151″/>
<mx:Text x=”251″ y=”214″ text=”COUNTRY” fontWeight=”bold” height=”20″/>
<mx:HBox id=”conby” x=”10″ y=”203″ width=”230″ label=”contact by”>
<mx:Text text=”CONTACT BY” fontWeight=”bold” width=”103″/>
<mx:TextInput width=”110″/>
</mx:HBox>
<mx:HBox id=”mob” x=”251″ y=”269″ width=”228″ height=”27″ label=”mobile”>
<mx:Text text=”MOBILE” fontWeight=”bold” width=”70″/>
<mx:TextInput width=”149″/>
</mx:HBox>
<mx:HBox id=”lan” x=”10″ y=”233″ width=”230″ height=”27″ label=”landline”>
<mx:Text text=”LANDLINE1″ fontWeight=”bold” width=”106″/>
<mx:TextInput width=”108″/>
</mx:HBox>
<mx:HBox id=”fax” x=”251″ y=”304″ width=”230″ height=”26″ label=”fax”>
<mx:Text text=”FAX” fontWeight=”bold” width=”71″/>
<mx:TextInput width=”148″/>
</mx:HBox>
<mx:Text x=”259″ y=”159″ text=”CITY” fontWeight=”bold” height=”20″/>
<mx:Text x=”251″ y=”187″ text=”STATE” fontWeight=”bold” height=”20″/>
<mx:TextInput x=”328″ y=”185″ width=”151″/>
<mx:HBox id=”lan0″ x=”10″ y=”268″ width=”230″ height=”27″ label=”landline”>
<mx:Text text=”LANDLINE2″ fontWeight=”bold” width=”106″/>
<mx:TextInput width=”108″/>
</mx:HBox>
<mx:HBox id=”lan1″ x=”10″ y=”303″ width=”230″ height=”27″ label=”landline”>
<mx:Text text=”EMAIL” fontWeight=”bold” width=”106″/>
<mx:TextInput width=”108″/>
</mx:HBox>
</mx:Canvas>
<mx:Canvas id=”ccan” label=”COMPANY DETAILS” width=”100%” height=”100%”>
<mx:Text x=”10″ y=”44″ text=”COMPANY NAME” width=”105″ fontWeight=”bold”/>
<mx:TextInput x=”138″ y=”42″/>
<mx:Text x=”10″ y=”79″ text=”PROFESSION” fontWeight=”bold”/>
<mx:TextInput x=”138″ y=”77″/>
<mx:Text x=”10″ y=”120″ text=”DESIGNATION” fontWeight=”bold”/>
<mx:TextInput x=”138″ y=”118″/>
<mx:Text x=”10″ y=”160″ text=”ADDRESS” fontWeight=”bold”/>
<mx:TextInput x=”138″ y=”223″/>
<mx:TextArea x=”138″ y=”148″ height=”67″/>
<mx:Text x=”18″ y=”227″ text=”CITY” fontWeight=”bold”/>
<mx:Text x=”18″ y=”257″ text=”STATE” fontWeight=”bold”/>
<mx:Text x=”315″ y=”44″ text=”MOBILE” fontWeight=”bold”/>
<mx:TextInput x=”393″ y=”42″ width=”122″/>
<mx:Text x=”315″ y=”77″ text=”LANDLINE1″ fontWeight=”bold”/>
<mx:TextInput x=”393″ y=”75″ width=”122″/>
<mx:Text x=”315″ y=”147″ text=”FAX” fontWeight=”bold”/>
<mx:TextInput x=”393″ y=”145″ width=”122″/>
<mx:Text x=”315″ y=”185″ text=”EMAIL” fontWeight=”bold”/>
<mx:TextInput x=”393″ y=”183″ width=”122″/>
<mx:Text x=”315″ y=”107″ text=”LANDLINE2″ fontWeight=”bold”/>
<mx:TextInput x=”394″ y=”105″ width=”122″/>
<mx:TextInput x=”138″ y=”253″/>
<mx:Text x=”18″ y=”285″ text=”COUNTRY” fontWeight=”bold”/>
<mx:TextInput x=”138″ y=”283″/>
<mx:Text x=”18″ y=”320″ text=”PIN” fontWeight=”bold”/>
<mx:TextInput x=”138″ y=”318″/>
</mx:Canvas>
<mx:Canvas  id=”fcan” label=”FAMILY DETAILS” width=”100%” height=”100%” creationComplete=”inlisten()”>
<mx:Text x=”26″ y=”58″ text=”SPOUSE NAME” fontWeight=”bold”/>
<mx:Text x=”121″ y=”24″ text=”First name”/>
<mx:Text x=”251″ y=”24″ text=”Middle name”/>
<mx:Text x=”372″ y=”24″ text=”Last name”/>
<mx:TextInput x=”121″ y=”50″ width=”122″/>
<mx:TextInput x=”251″ y=”50″ width=”113″/>
<mx:TextInput x=”372″ y=”50″ width=”129″/>
<mx:Text x=”26″ y=”84″ text=”D.O.B*” fontWeight=”bold”/>
<mx:DateField x=”121″ y=”82″ width=”114″/>
<mx:Text x=”26″ y=”110″ text=”ANNIVERSARY” fontWeight=”bold” height=”20″/>
<mx:DateField x=”121″ y=”112″ width=”110″/>
<mx:Text x=”26″ y=”170″ text=”KID NAME” fontWeight=”bold”/>
<mx:TextInput x=”121″ y=”168″ width=”122″/>
<mx:TextInput x=”251″ y=”168″ width=”113″/>
<mx:TextInput x=”372″ y=”168″ width=”129″/>
<mx:Text x=”121″ y=”142″ text=”First name”/>
<mx:Text x=”251″ y=”142″ text=”Middle name”/>
<mx:Text x=”372″ y=”142″ text=”Last name”/>
<mx:Text x=”509″ y=”170″ text=”KID D.O.B*” fontWeight=”bold”/>
<mx:DateField x=”589″ y=”170″ width=”114″/>
<mx:Button x=”711″ y=”170″ label=”+” width=”42″ id=”plus”/>
<mx:HBox id=”hre” x=”26″ y=”210″ width=”771″ visible=”false” height=”24″>
<mx:Text text=”KID NAME” fontWeight=”bold” width=”86″/>
<mx:TextInput  width=”122″/>
<mx:TextInput width=”113″/>
<mx:TextInput width=”129″/>
<mx:Text text=”KID D.O.B*” fontWeight=”bold” width=”74″/>
<mx:DateField width=”121″/>
<mx:Button label=”+” width=”42″ id=”plus0″ />
</mx:HBox>
<mx:HBox id=”hre0″ x=”26″ y=”242″ width=”771″ visible=”false” height=”22″>
<mx:Text text=”KID NAME” fontWeight=”bold” width=”88″/>
<mx:TextInput  width=”122″/>
<mx:TextInput width=”113″/>
<mx:TextInput width=”129″/>
<mx:Text text=”KID D.O.B*” fontWeight=”bold” width=”74″/>
<mx:DateField width=”121″/>
<mx:Button label=”+” width=”42″ id=”plus1″/>
</mx:HBox>
<mx:HBox id=”hre3″ x=”26″ y=”281″ width=”771″ visible=”false” height=”25″>
<mx:Text text=”KID NAME” fontWeight=”bold” width=”89″/>
<mx:TextInput  width=”122″/>
<mx:TextInput width=”113″/>
<mx:TextInput width=”129″/>
<mx:Text text=”KID D.O.B*” fontWeight=”bold” width=”75″/>
<mx:DateField width=”121″/>
<mx:Button label=”+” width=”42″ id=”plus2″/>
</mx:HBox>
</mx:Canvas>
</mx:TabNavigator>
</mx:Panel>
<mx:Panel id=”cpan” x=”653″ y=”0″ width=”371″ height=”66″ layout=”absolute” title=”control panel “>
<mx:Text x=”24″ y=”25″ text=”FIELDS” fontWeight=”bold”/>
<mx:Text x=”24″ y=”204″ text=”REMOVED FIELDS” fontWeight=”bold”/>
<mx:List id=”li” x=”24″ y=”230″ width=”98″ height=”100″ dataProvider=”{redata}”></mx:List>
<mx:Button id=”addre” x=”130″ y=”241″ label=”&lt;&lt;ADD”/>
<mx:Text x=”10″ y=”36″ text=”ADDING NEW FIELDS” fontWeight=”bold”/>
<mx:Text x=”24″ y=”80″ text=”ENTER FIELD NAME”/>
<mx:TextInput id=”nwtex” x=”149″ y=”78″ width=”95″/>
<mx:Button id=”addnw” x=”149″ y=”168″ label=”&lt;&lt;ADD”/>
<mx:Text x=”24″ y=”124″ text=”DETAILS TYPE” fontWeight=”normal”/>
<mx:ComboBox id=”typ” x=”149″ y=”122″ width=”178″>
<mx:ArrayCollection>
<mx:String>Personal Details</mx:String>
<mx:String>Company Details</mx:String>
<mx:String>Family Details</mx:String>
</mx:ArrayCollection>
</mx:ComboBox>
<mx:Button id=”min” label=”minimize” x=”274″ y=”0″/>
<mx:Button x=”179″ y=”0″ label=”maximize” click=”movef()”/>

</mx:Panel>
</mx:Application>

FOR DOWNLOADING

http://www.box.net/shared/ppmuafl72h