子容器的動態生成與銷燬

Flex引入子容器有兩種方式

1.通過MXML可視化標籤，如

<ng:EmpSuggestion id="topManagerInput" text="{(globalTenantEntityBean.topManagers)[0].notesId}" />

2.在actionscript中添加，如

                    var emp1:EmpSuggestion = new EmpSuggestion();
                    emp1.name="emp1";
                    hbox1.addChild(emp1);

顯然，第一種方式只是靜態的容器，第二種才滿足動態的添加。

本文便是基於第二種方式討論子容器的動態添加與銷燬，並如何賦予並獲得子容器中的數據。例如我們要實現動態的添加輸入框，同時給輸入框賦值。生成後我們也能刪除指定的子容器，最後把子容器中的值取出來。

第一步，引入一靜態容器

            <mx:VBox id="tenantAdmin">
            </mx:VBox>

第二步，然後actionscript中動態添加，同時考慮到刪除，所以子容器是HBox再嵌套textInput和delete的action（可以使按鈕或圖標），通過給按鈕或圖標加監控來實現特定hBox的刪除。並給Child起個名字方便以後讀數據時“認人”

                    var hbox1:HBox = new HBox();
                    hbox1.setStyle("verticalAlign","middle");
                    var img1:Image = new Image();
                    img1.source = deleteIcon;
                    img1.buttonMode = true;
                    img1.addEventListener(MouseEvent.CLICK,cancelFunction1)
                    var emp1:EmpSuggestion = new EmpSuggestion();
                    emp1.name="emp1";//起名字
                    hbox1.addChild(emp1);
                    hbox1.addChild(img1);//添加子容器
                    tenantAdmin.addChild(hbox1);

生成時可以通過按鈕一個個觸發，也可以通過數組循環來生成

for(var c:int=1;c<globalTenantEntityBean.topManagers.length;c++) { var hbox:HBox = new HBox(); hbox.setStyle("verticalAlign","middle"); var img:Image = new Image(); img.source = deleteIcon; img.buttonMode = true; img.addEventListener(MouseEvent.CLICK,cancelFunction) var emp:EmpSuggestion = new EmpSuggestion(); emp.text = (globalTenantEntityBean.topManagers)[c].notesId; emp.name="emp"; hbox.addChild(emp); hbox.addChild(img); topManager.addChild(hbox); }

上面代碼中cancelFunction1就是實現刪除，刪除用的是removeChild方法，參數的生成：先選中對象event.currentTarget指的是click的那個按鈕或Image，(event.currentTarget).parent是這個按鈕的父容器，轉化爲HBox類。

                public function cancelFunction1(event:MouseEvent):void
                {
                    tenantAdmin.removeChild(HBox((event.currentTarget).parent));
                }

第三步，讀取子容器中的數據，用getChildren()返回一個子容器的數組，我一開始取不到數據犯的錯誤就是for each(var hbox:HBox in topManager)，後來trace的時候發現topManager裏是沒有子容器的，必須調用getChildren（）方法取得子容器，再用getChildByName通過名字來取.

                        for each(var hbox:HBox in topManager.getChildren())
                        {
                            var ep:EmployeeVBean = new EmployeeVBean();
                            ep.empNotesId = (hbox.getChildByName("emp1")as EmpSuggestion).text;
                            arr.addItem(ep);
                        }

這樣就取得了子容器裏的內容了