Flex中弹出窗体的应用和开发

在flex中创建一个弹出窗体可以使用TitleWindow对象。

在TitleWindow中设置标题和是否可以关闭添加监控事件,在Flex中弹出窗体必须进行相应的关闭处理释放资源信息!

<mx:Script>
  <![CDATA[
   import util.AppGlobal;
   import mx.events.CloseEvent;
   import mx.managers.PopUpManager;
// 创建弹出窗体
   var titlewin:HotelOperatorLog=new HotelOperatorLog();
   // 创建弹出窗台时间
   private function popOperatorLog():void{
   //设置弹出窗体的各种信息
    titlewin.title="操作日志信息";
    titlewin.showCloseButton=true;
    titlewin.width=650;
    titlewin.height=450;
     //添加关闭监控事件用于销毁对象信息   
    titlewin.addEventListener(CloseEvent.CLOSE,operatelogClose);
   //窗体的信息   
     PopUpManager.addPopUp(titlewin,AppGlobal.application,true);
     PopUpManager.centerPopUp(titlewin);
}
   //关闭窗体销毁界面信息
   private function operatelogClose(evt:CloseEvent):void
   {
     PopUpManager.removePopUp(titlewin);
   }
  ]]>
 </mx:Script>


则弹出窗口将出现在此组件的局部坐标中心。若要在全局坐标中心弹出,则修改代码如下:

PopUpManager.addPopUp(titlewin,AppGlobal.application,true); 
 居中弹出
PopUpManager.centerPopUp(titlewin);
 第一个参数为:弹出的窗体
 第二个参数为:弹出时相对的窗体
 第三个参数表示是否为模式窗体的

弹出窗体的几种形式:

1.如果使用MVC框架,相信这并不是一个问题。而如果没有使用的话,可以用类似的方法设置一个单例,子窗口和父窗口通过这个单例来交互消息,如果需要解耦,请发送自定义事
件。总之,只要按照MVC思路来做就可以了。
2.类似JS,在子窗口的构造函数里增加一个参数,将父窗口传参进去。MXML没有构造函数,用一个属性来保存父窗口引用也可以。
3.无论是createPopUp还是addPopUp,他们都有一个返回值,得到子窗口的实例。可以对这个实例监听remove事件,并在这个事件中直接读取子窗口需要返回给父窗口的属性。(记
得要将这个事件最终移除)
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
 <mx:Panel x="94" y="178" width="503" height="347" layout="absolute">
  <mx:TextInput x="134" y="64" id="tit_usr" text="username"/>
  <mx:TextInput x="134" y="125" id="tit_psw" text="password"/>
  <mx:Button x="171" y="209" label="Submit" click="mytw_click()"/>
 </mx:Panel>
 <mx:Script>
  <![CDATA[
 import mx.containers.TitleWindow;
 import mx.managers.PopUpManager;
 import mx.controls.Text;
 
 private var tw:titlewindow=new titlewindow();
 
 private function  mytw_click():void{
  if(tw.visible){
   PopUpManager.removePopUp(tw);
  }
  PopUpManager.addPopUp(tw,this);
  PopUpManager.centerPopUp(tw);
  tw.addEventListener("tw_click",update);
 }
 
 private function update(event:Event):void{
  tit_usr.text=tw.tw_usr.text;
  tit_psw.text=tw.tw_psw.text;
  PopUpManager.removePopUp(tw);
 }
  ]]>
 </mx:Script>
 
</mx:Application>


弹出窗口:

<mx:TitleWindow xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="498" height="368" showCloseButton="true" close="PopUpManager.removePopUp

(this)">
 <mx:Label x="96" y="67" text="username" width="97" height="26"/>
 <mx:Label x="96" y="128" text="password" width="97" height="24"/>
 <mx:TextInput x="217" y="65" id="tw_usr"/>
 <mx:TextInput x="217" y="126" id="tw_psw"/>
 <mx:Button x="228" y="239" label="Click" click="btn_click()"/>
 <mx:Script>
  <![CDATA[
 import mx.managers.PopUpManager;
 import mx.controls.Text;
 
 private function btn_click():void{
  dispatchEvent(new Event("tw_click"));
 }
  ]]>
 </mx:Script>
 
</mx:TitleWindow>



4.

owner property 
owner:DisplayObjectContainer  [read-write]

我也不翻译了- -说真的我看到了感觉很囧。owner这个属性在Popup中没有用途,因此,可以在创建窗口的时候将子窗口的owner设置成父窗口(也就是当时的 this),然后子窗口

访问自己的owner属性即可。



父窗口代码:PopUpDemo.mxml

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
 <mx:Panel x="94" y="178" width="503" height="347" layout="absolute">
  <mx:TextInput x="134" y="64" id="tit_usr" text="username"/>
  <mx:TextInput x="134" y="125" id="tit_psw" text="password"/>
  <mx:Button x="171" y="209" label="Submit" click="mytw_click()"/>
 </mx:Panel>
 <mx:Script>
  <![CDATA[
 import mx.containers.TitleWindow;
 import mx.managers.PopUpManager;
 import mx.controls.Text;
 
 private var tw:titlewindow=new titlewindow();
 
 private function  mytw_click():void{
 
  tw.owner = this;
  PopUpManager.addPopUp(tw,this);
  PopUpManager.centerPopUp(tw);
 
 }
 
  ]]>
 </mx:Script>
 
</mx:Application>


弹出窗口代码:titlewindow.mxml

<mx:TitleWindow xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="498" height="368" showCloseButton="true" close="PopUpManager.removePopUp

(this)">
 <mx:Label x="96" y="67" text="username" width="97" height="26"/>
 <mx:Label x="96" y="128" text="password" width="97" height="24"/>
 <mx:TextInput x="217" y="65" id="tw_usr"/>
 <mx:TextInput x="217" y="126" id="tw_psw"/>
 <mx:Button x="228" y="239" label="Click" click="btn_click()"/>
 <mx:Script>
  <![CDATA[
   import mx.controls.Alert;
 import mx.managers.PopUpManager;
 import mx.controls.Text;
 
 private function btn_click():void{
  //dispatchEvent(new Event("tw_click"));
  var a:PopUpDemo = this.owner as PopUpDemo;
  a.tit_usr.text = this.tw_usr.text;
  a.tit_psw.text = this.tw_psw.text;
  PopUpManager.removePopUp(this);
 }
  ]]>
 </mx:Script>
 
</mx:TitleWindow> 

你可能感兴趣的:(mvc,框架,Flex)