flex中使用as代码创建popup、panel、titleWindow等组件

来源：互联网发布：swift 项目源码编辑：程序博客网时间：2024/05/22 08:06

先创建了一个list列表，作为显示的主要内容，然后用panel来装载它，用button来控制打开或者关闭panel

代码如下：

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" applicationComplete="initApp()">
<mx:Array id="_myData" xmlns="">
  <mx:String>一年级</mx:String>
  <mx:String>二年级</mx:String>
  <mx:String>三年级</mx:String>
  <mx:String>四年级</mx:String>
</mx:Array>
<mx:Script>
  <![CDATA[
   import mx.controls.Button;
   import mx.containers.ControlBar;
   import mx.managers.PopUpManager;
   import mx.containers.Panel;
   private var win:Panel;
   private function initApp():void
   {
    var closeBt:Button=new Button();
    closeBt.label="closePopup";
    closeBt.addEventListener(MouseEvent.MOUSE_DOWN,closePopup);
    var panelBar:ControlBar=new ControlBar();
    panelBar.addChild(closeBt);
    win=new Panel();
    win.x=200;
    win.y=200;
    win.width=300;
    win.height=200;
    win.addChild(myList);
    win.addChild(panelBar);
   }
   private function closePopup(e:MouseEvent):void
   {
    PopUpManager.removePopUp(win);
   }
   private function showPopup():void
   {
    PopUpManager.addPopUp(win,this,true);
   }
  ]]>
</mx:Script>
<mx:ApplicationControlBar x="10" y="43" width="483" height="30" dock="true">
  <mx:Button label="showPopup" id="showPopupBt" click="showPopup()"/>
</mx:ApplicationControlBar>
  <mx:List id="myList" dataProvider="{_myData}" width="322" x="10" y="10" height="211"></mx:List>
</mx:Application>

如果用TitleWindow来代替panel，与panel基本相同,但是无法用as指定自带关闭按钮执行关闭动作，只有直接拖放组件到页面，设定close事件才可以达到目的，不过有另一种折衷方法来实现，就是自定义用户控件，继承自titleWindow，然后把showCloseButton设置为true，设置close事件，然后在需要titleWindow的页面上使用脚本定义出一个自定义控件的实例，这样就可以解决，具体如下：

自定义控件：

<?xml version="1.0" encoding="utf-8"?>
<mx:TitleWindow xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="400" height="300" creationComplete="initUI()" showCloseButton="true" close="closeWin()">
<mx:Script>
  <![CDATA[
   import mx.managers.PopUpManager;
   internal function initUI():void
   {
    initTxt.text="窗口初始化……";
      }
   internal function closeWin():void
   {
    PopUpManager.removePopUp(this);
   }
  ]]>
</mx:Script>
<mx:Label x="285" y="230" text="" fontSize="12" id="initTxt"/>

</mx:TitleWindow>
我把它命名为myWindow,我把它放在myUI目录下,在页面上这样去调用它：

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"applicationComplete="initApp()">

import myUI.myWindow;

private var titleWin:myWindow;

private function initApp():void
{

...

titleWin=new myWindow();

PopUpManager.addPopUp(titleWin,this,true);

...

}

0 0