mxml中動態生成組件

客戶那邊的API 返回值如下

<list>

<com.allmerica.imagepro.to.AttributeTO>

<name>INDEX1</name>

<label>RUSH</label>

<mandatory>Y</mandatory>

<type>DROPDOWN</type>

<format>NONE</format>

<order>1</order>

<busType></busType>

<size>10</size>

<maxLength>0</maxLength>

<varId>1</varId>

</com.allmerica.imagepro.to.AttributeTO>

<com.allmerica.imagepro.to.AttributeTO>

<name>INDEX2</name>

<label>Policy_Sym_Num_Mod</label>

<mandatory>Y</mandatory>

<type>TEXTBOX</type>

<format>NONE</format>

<order>2</order>

<busType>P</busType>

<size>10</size>

<maxLength>12</maxLength>

<varId>2</varId>

</com.allmerica.imagepro.to.AttributeTO>

.....

</list>

public function genLabel(text:String):Label{
var label:Label=new Label();
label.text=text;
label.visible=true;
label.height=20;
return label;
}
public function genDateField(idname:String,val:String=null):DateField{
var dateField:DateField=new DateField();
dateField.editable=false;
dateField.height=20;
dateField.id=idname;
if(val!=null) dateField.text=val;
return dateField;
}
public function genCombox(idname:String,ac:ArrayCollection,index:int=-1):ComboBox{
var c:ComboBox=new ComboBox();
c.id=idname;
c.visible=true;
c.height=20;
c.labelField="name";
c.dataProvider=ac;
if(index!=-1) c.selectedIndex=index;
return c;
}
public function genValidator(component:DisplayObject,str:String,msg:String):RegExpValidator{
var validator:RegExpValidator= new RegExpValidator();
validator.property = "text";
validator.source = component;
validator.expression = str;
validator.noMatchError = msg;
validator.required = false;
return validator;
}

//model中的校驗規則

public var validateRule:Object={
INDEX5:['[0-9]{7}','AGENT CODE entered is invalid. OK.'],
INDEX8:['[A-Za-z]{2}','UW Initials entered is invalid. OK'],
INDEX10:['[0-9]{10}','Customer Number entered is invalid. OK'],
symbol:['[A-Z]{3}','Field requires a 3 alpha policy symbol. OK'],
number:['[0-9]{7}','Field requires a 7 digit policy number. OK'],
mod:['[0-9]{2}','Field requires a 2 digit policy module. OK']
};
public function genTextField(idname:String,len:int=0,val:String=null):TextInput{
var t:TextInput=new TextInput();
t.id=idname;
t.visible=true;
t.height=20;
if(len!=0) t.width=len*12;
if(val!=null) t.text=val;

//校驗
var rule:Object=MiscModelLocator.getInstance().validateRule;
if(rule.hasOwnProperty(idname)){
var validator:RegExpValidator=genValidator(t,rule[idname][0],rule[idname][1]);
MiscModelLocator.getInstance().validator.push(validator);
}
return t;
}

//policy 爲初始值
public function genPolicy(policy:String):HBox{
var componet:DisplayObject;
var componet1:DisplayObject;
var componet2:DisplayObject;
if(policy!=null){
componet=genTextField("symbol",3,policy.substr(0,3));
componet1=genTextField("number",7,policy.substr(3,7));
componet2=genTextField("mod",2,policy.substr(10,2));
}else{
componet=genTextField("symbol",3);
componet1=genTextField("number",7);
componet2=genTextField("mod",2);
}
var hbox:HBox=new HBox();
hbox.addChild(componet);
hbox.addChild(componet1);
hbox.addChild(componet2);
return hbox;
}

//遍歷ArrayCollection中的輸入框默認值

private function findAC(ac:ArrayCollection,val:String):String{
if(ac==null ||val==null) return null;

for each(var obj:Object in ac){
if(obj["name"]==val) return obj["desc"];
}
return null;
}

//遍歷ArrayCollection中的ComboBox的selectedIndex
private function findTwoAC(val:String,ac:ArrayCollection,ac1:ArrayCollection):int{
if(ac==null||val==null||ac1==null) return -1;
for each(var obj:Object in ac){
if(obj["name"]==val){
for(var i:int=0;i<ac1.length;i++){
if(obj["desc"]==ac1[i]["name"]) return i;
}
}
}
return -1;
}
public function addBox(boxLeft:VBox,boxRight:VBox,obj:Object,obj1:Object,ac:ArrayCollection=null):void{
var label:Label;
var componet:DisplayObject;
label=genLabel(obj["label"]);
boxLeft.addChild(label);
if(obj["type"]=="TEXTBOX"){ //TEXTINPUT類型
if(obj["label"]=="Policy_Sym_Num_Mod"){
var policy:String=findAC(ac,obj["name"])
var hbox:HBox=genPolicy(policy);
boxRight.addChild(hbox);
}else if(obj["label"].toString().indexOf("_Date")!=-1){ //日期類型
var dateField:DateField=genDateField(obj["name"],findAC(ac,obj["name"]));
boxRight.addChild(dateField);
}else{
componet=genTextField(obj["name"],15,findAC(ac,obj["name"]));
boxRight.addChild(componet);
}
}else if(obj["type"]=="DROPDOWN"){ //ComboBox類型
componet=genCombox(obj["name"],obj1[obj["label"]],findTwoAC(obj["name"],ac,obj1[obj["label"]]));
boxRight.addChild(componet);
}else{ //其他類型
XAlert.info(obj["type"]);
}
}//end function


public function pushIdName(model:Array,arr:Array):void{
var policy:String="";
for(var i:int=0;i<arr.length;i++){
var component:DisplayObject=arr[i] as DisplayObject;
var val:String;
var id:String=component["id"];
if(id!=null && id.indexOf("INDEX")!=-1){
if(component.hasOwnProperty("selectedItem")){
val=String(component["selectedItem"]["id"]);
if(val=="-1"){
val="";
}
}else{
val=component["text"];
}
if(val!=null && val!=""){
var vo:IdNameVo=new IdNameVo();
vo.name=component["id"];
vo.desc=val;
model.push(vo);
}
}else{
var hbox:HBox=component as HBox;
for each(var com:DisplayObject in hbox.getChildren()){
if(com["text"]=="")policy+="%";
else policy+=com["text"];
}
}
}//end for
if(policy!="" && policy!="%%%"){
var vo1:IdNameVo=new IdNameVo();
vo1.id=822;
vo1.name="INDEX2";
vo1.desc=policy;
model.push(vo1);
}
}//end function



public function resetToBlank(children:Array):void{
if(children.length>0){
for(var i:int=0;i<children.length;i++){
if(children[i] is Container){ //for example HBox
var container:Container=children[i] as Container;
if(container.getChildren().length>0){ //遞歸
resetToBlank(container.getChildren());
}
}else{
var component:DisplayObject=children[i] as DisplayObject;
var componentInfo:Object = ObjectUtil.getClassInfo(component);
if(componentInfo.name == "mx.controls::ComboBox"){
component["selectedIndex"]=0;
}else if(componentInfo.name == "mx.controls::TextInput" || componentInfo.name == "mx.controls::DateField"){
if(component.hasOwnProperty("text"))component["text"]="";
}
}
}//end for
}//end if
}

public function whichBox(arr:Array,obj:Object,len:int,obj1:Object,ac:ArrayCollection):void{
var boxLeft1:VBox =arr[0] as VBox;
var boxRight1:VBox =arr[1] as VBox;
var boxLeft2:VBox =arr[2] as VBox;
var boxRight2:VBox =arr[3] as VBox;
if(obj["order"]<=len){
CommonFun.getInstance().addBox(boxLeft1,boxRight1,obj,obj1,ac);
}else{
CommonFun.getInstance().addBox(boxLeft2,boxRight2,obj,obj1,ac);
}
}


public function boxView(arr:Array,obj:Object):void{
var attrLeft1:VBox =arr[0] as VBox; //左邊的label
var attrRight1:VBox =arr[1] as VBox; //左邊的控件

var attrLeft2:VBox =arr[2] as VBox; //右邊的label
var attrRight2:VBox =arr[3] as VBox; // 右邊的控件

try{

//先刪除
attrLeft1.removeAllChildren();
attrRight1.removeAllChildren();
attrLeft2.removeAllChildren();
attrRight2.removeAllChildren();
var ac:ArrayCollection = new ArrayCollection();
if(obj.hasOwnProperty("to")) ac.source = obj["to"]["attribValues"] ;
else ac=null;
for each(var obj1:Object in obj["list"]){
whichBox(arr,obj1,8,obj,ac);
}
} catch(e:Error){
XAlert.error("GetDocAttributes.boxView:"+e.message);
}
}

注意的問題：

1 <mx:VBox></mx:VBox> 爲空時設置高度,因爲沒有設置高度，動態添加的組件不顯示

2 getChildren,childDescriptors的區別

childDescriptors 特指嵌入的mxml子組件

getChildren指所有的子組件