FLEX实践：自定义弹出窗口与主页面的交互（仿造EBS的LOV窗口）

自定义类LovColumn.as

package Class
{
public class LovColumn
{
public var columnName:String;
public var dataField:String;
public var visible:Boolean=true;
public function LovColumn()
{
}

}
}



自定义组件：LovComponent.mxml

<?xml version="1.0" encoding="utf-8"?>
<mx:TitleWindow xmlns:mx="http://www.adobe.com/2006/mxml"
layout="absolute"
showCloseButton="true"
close="cancel()"
borderColor="#C6D7F5"
themeColor="#009DFF"
cornerRadius="10"
creationComplete="init()">
<mx:Script>
<![CDATA[
import Class.CarVO;
import Class.LovColumn;
import mx.collections.ArrayCollection;
import mx.controls.dataGridClasses.DataGridColumn;
import mx.managers.*;
import mx.controls.*;

public var titleName:String;
public var columnArray:ArrayCollection=new ArrayCollection();
public var sourceArray:ArrayCollection=new ArrayCollection();
[Bindable]public var resultObject:Object=new Object();
[Bindable]public var mainApp:Object = null;
private function init():void{

this.title=titleName;

for(var i:Number=0;i<columnArray.length;i++){
var column:DataGridColumn= new DataGridColumn();
column.headerText = columnArray[i].columnName;
column.dataField =columnArray[i].dataField;
column.visible=columnArray[i].visible;
dg.columns=dg.columns.concat(column);
}
dg.dataProvider=sourceArray;
}

private function submit():void{
resultObject=sourceArray[dg.selectedIndex];
mainApp.resultObject=this.resultObject;
cancel();
}
private function cancel():void{
PopUpManager.removePopUp(this);
}
]]>
</mx:Script>
<mx:DataGrid id="dg" x="10" y="10">

</mx:DataGrid>
<mx:Button x="359" y="250" label="Submit" click="submit()"/>

</mx:TitleWindow>



main.mxml

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" fontSize="13"
backgroundGradientAlphas="[1.0, 1.0]" backgroundGradientColors="[#EAFCD1, #C9D6FE]" creationComplete="init()">

<mx:Script>
<![CDATA[
import myComponent.LovComponent;
import Class.CarVO;
import Class.LovColumn;
import mx.collections.ArrayCollection;
import mx.managers.*;
import mx.controls.*;

var columnArray:ArrayCollection=new ArrayCollection();
var sourceArray:ArrayCollection=new ArrayCollection();
[Bindable]public var resultObject:Object=new Object();
private function init():void{
var lovColumn:LovColumn=new LovColumn();
lovColumn.columnName="Car Name";
lovColumn.dataField="name";

var lovColumn2:LovColumn=new LovColumn();
lovColumn2.columnName="Aviliable";
lovColumn2.dataField="available";
lovColumn2.visible=false;
columnArray.addItem(lovColumn);
columnArray.addItem(lovColumn2);

var car:CarVO=new CarVO();
car.name="Ford";
car.available=true;
var car1:CarVO=new CarVO();
car1.name="Nissa";
car1.available=true;
var car2:CarVO=new CarVO();
car2.name="BUICK";
car2.available=false;
sourceArray.addItem(car);
sourceArray.addItem(car1);
sourceArray.addItem(car2);
}

private function search():void{
var lovComponent:LovComponent=LovComponent(PopUpManager.createPopUp(this,LovComponent,false));
lovComponent.mainApp = this;
lovComponent.titleName="Car Search Window";
lovComponent.columnArray=this.columnArray;
lovComponent.sourceArray=this.sourceArray;
lovComponent.resultObject=this.resultObject;
lovComponent.width=500;
lovComponent.height=400;
PopUpManager.centerPopUp(lovComponent);

}

]]>
</mx:Script>
<mx:Label x="385" y="124" text="Result:"/>
<mx:TextInput x="459" y="122" id="carName" text="{resultObject.name}"/>
<mx:Button x="618" y="122" label="..." width="43" click="search()" cornerRadius="5" fillAlphas="[1.0, 1.0]" fillColors="[#FCF2D8, #F7F9FC]"/>

</mx:Application>



运行结果：