PopUpButton 下拉弹出窗口控件

PopUpButton 是一个特殊的Button， 本身由两个Button组成：主按钮和子按钮。点击子按钮可以将任何组件作为窗口弹出，置于最上层。这个弹出动作由 PopUpMenuButton 完成。

PopUpButton 的open 事件和 close 事件：弹出和弹出窗口关闭时触发。

popUp 属性：将要弹出的对象。

DropdownEvent.CLOSE 和 DropdownEvent.OPEN 事件专门针对弹出窗口。点击主按钮，触发的事件和Button 是一样的，比如click。

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="initApp()" layout="absolute">
 <mx:Style>
  Application{
   fontSize:12;
   backgroundGradientColors: #c0c0c0, #c0c0c0;
  }
 </mx:Style>
 <mx:Script>
  <![CDATA[
   import mx.containers.Panel;  
   import mx.controls.Alert; 
   import mx.events.DropdownEvent;

   private var panel:Panel;

   private function initApp():void {
    panel = new Panel();  //声明新的Panel
    panel.title = "panel";
    panel.width = 200;
    panel.height = 200;
    popBtn.popUp = panel;   //指定popUp目标对象  
    popBtn.addEventListener(DropdownEvent.CLOSE,closeHandler); //   
    popBtn.open();  //将窗口弹出
   }   

   
   private function closeHandler(evt:DropdownEvent):void{
    Alert.show("关闭窗口");
   }
  ]]>
 </mx:Script>
    <mx:PopUpButton id="popBtn" label="弹出" width="135"  x="23" y="23"/>
 
</mx:Application>

 

PopUpMenuButton

继承自PopUpButton，是 PopUpButton的一个特殊实例。只能把Menu 当作弹出窗口，且Menu 只能有1给层级。

Menu 用来创建菜单，不过和 Menu相比，它少了菜单条。且没有对应的MXML标签，只能由代码创建。

PopUpMenuButton 中内置了一个Menu 。

定义XML 数据，将它传给 PopUpMenuButton 的 dataProvider ，作为内置的Menu 的数据源。

MenuEvent.ITEM_CLICK 事件：当菜单项被选中时，事件被触发，同时菜单关闭。

 

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="initApp()" layout="absolute">
 <mx:Style>
  Application{
   fontSize:12;
   backgroundGradientColors: #c0c0c0, #c0c0c0;
  }
 </mx:Style>
 <mx:Script>
  <![CDATA[ 
   import mx.controls.Alert; 
   import mx.events.MenuEvent;
   
   private var mXML:XMLList =
                <>
                 <node label="文件">
                        <node label="新建画板" data="new"/>
                        <node label="清除画板" data="clear" enabled="false"/>
                        <node label="退出系统" data="logout"/>
                    </node>
                    <node label="工具"/>                      
                    <node label="帮助">
                      <node label="帮助" data="help"/>
                      <node label="关于作者" data="about"/>
                     </node>
                </>;
   private function initApp():void {
    popBtn.dataProvider = mXML; //弹出菜单的数据源
    popBtn.addEventListener(MenuEvent.ITEM_CLICK,clickHandler); 
   }   
   private function clickHandler(evt:MenuEvent):void{
    Alert.show("选择菜单："+evt.label+":菜单序号："+evt.index);
   }
  ]]>
 </mx:Script>
    <mx:PopUpMenuButton id="popBtn" labelField="@label" width="135"  x="23" y="23"/>
 
</mx:Application>