Flex 父窗口 子窗口 数据传递

Flex 父窗口 子窗口 数据传递

2009-01-11 1:51

这里通过一个实例演示Flex父窗口和弹出的子窗口之间的数据传输。

先创建一个MXML component 命名为ListTitleWindow.mxml (Based on : TitleWindow)

xml 代码

<?xml version="1.0" encoding="utf-8"?>
<mx:TitleWindow xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical" width="400" height="300"
    creationComplete="initComponent()"
      showCloseButton="true"
      close="closeWindow()">

    <mx:Script>

        <CDATA

         /* 数据xml格式如下：
            <items>
                <item label="Tom" data="num001"/>
                <item label="Lucy" data="num002"/>
            </items>
         */

          import mx.managers.PopUpManager;
          import mx.rpc.events.ResultEvent;
          import mx.controls.Alert;

          [Bindable]public var mainApp:Object = null;
          [Bindable]public var headTitle:String;
          [Bindable]public var url:String;
          [Bindable]public var selectedItem:Object;
          [Bindable]public var callbackFunction:Function;   //回调函数

          private function initComponent():void {
             //listDataService.url = url;
             listDataService.send();
          }

         //closeWindow
          private function closeWindow():void {
                PopUpManager.removePopUp(this);
          }

          private function submit():void {
              PopUpManager.removePopUp(this);
              if (selectedItem != null && callbackFunction != null) {
                  //调用父窗体的方法并以参数形式返回选择结果
                  callbackFunction.call(mainApp, selectedItem.data);
              }
          }

          private function mySelection(oEvent:Event):void {
             selectedItem = oEvent.target.selectedItem;
          }

         private function initListData(event:ResultEvent):void {
             //使用HTTPService返回的xml数据,初始化List数据
            dataList.dataProvider = event.result.items.item;
         }

        >
    </mx:Script>

    <mx:HTTPService id="listDataService" url="{url}" showBusyCursor="true"  result="initListData(event)" />

    <mx:Label text="{headTitle}"/>

    <mx:List id="dataList" width="100%" color="blue" change="mySelection(event)" />

    <mx:VBox width="100%">
        <mx:Label text="Selected State: {selectedItem.label}"/>
        <mx:Button label="OK" click="submit();"/>
    </mx:VBox>

</mx:TitleWindow>

使用一个MXML application 作为父窗体,代码如下

xml 代码

xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
    initialize="initApp()">
    <mx:Style source="styles/main.css"/>

    <mx:Script>

     import mx.controls.Alert;
     import flash.display.StageDisplayState;
     import components.window.ListTitleWindow;
     import mx.containers.TitleWindow;
     import mx.managers.PopUpManager;
     import mx.collections.ArrayCollection;

     private function initApp() : void {
     }
     private function showTitleWindow():void {
         var titleWindowInstance:ListTitleWindow =
             ListTitleWindow(PopUpManager.createPopUp(this, ListTitleWindow, false));

         titleWindowInstance.title = "Welcome";
         titleWindowInstance.width = 400;
         titleWindowInstance.height = 300;
         titleWindowInstance.mainApp = this;
         titleWindowInstance.headTitle = "Select a item.";
         titleWindowInstance.url="http://localhost:8080/test.xml";
         titleWindowInstance.callbackFunction = this.myFunction;

         PopUpManager.centerPopUp(titleWindowInstance);
      }

     public function myFunction(bb:String):void {
         Alert.show(bb);
     }
     ]]>

    mx:Script>

    <mx:Button x="63" y="96" label="Button" click="showTitleWindow();"/>

mx:Application>