PopUpButton弹出树形菜单

发布于，归属于flex实例。 沙发还空着，抢！ 共有409人围观    

先来看演示：


当用户点击PopUpButton时，弹出一个树形菜单，点击菜单项，弹出个包含该项信息的窗口。

来看下源代码：

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
  3.     <mx:Style>
  4.         Application{
  5.             fontSize:12px;
  6.         }
  7.         Tree {
  8.             textAlign: left;
  9.             fontWeight: normal;
  10.         }
  11.     </mx:Style>
  12.     <mx:Script>
  13.         <![CDATA[
  14.             private var selectedNode:XML;
  15.             import mx.controls.Alert;
  16.             private function treeChanged(evt:Event):void{
  17.                 selectedNode = Tree(evt.target).selectedItem as XML;
  18.                
  19.                 Alert.show("你选择的是："+selectedNode.@label,"提示消息",Alert.YES,this);
  20.             }
  21.         ]]>
  22.     </mx:Script>
  23.     <mx:XMLList id="treeXml">
  24.         <folder label="菜单">
  25.             <folder label="jquery">
  26.                 <folder label="jquery插件" />
  27.                 <folder label="jquery教程" />
  28.             </folder>
  29.             <folder label="flex">
  30.                 <folder label="flex实例" />
  31.                 <folder label="flex教程" />
  32.             </folder>
  33.             <folder label="ext">
  34.                 <folder label="ext实例" />
  35.                 <folder label="ext教程" />
  36.             </folder>                                   
  37.         </folder>
  38.     </mx:XMLList>
  39.     <mx:PopUpButton label="请选择">
  40.         <mx:popUp>
  41.             <mx:Tree id="tree" dataProvider="{treeXml}" labelField="@label" showRoot="false" width="200" change="treeChanged(event)" />
  42.         </mx:popUp>
  43.     </mx:PopUpButton>
  44. </mx:Application>
（如果您喜欢这篇教程，可以通过支付宝打赏我们1元哦，拜谢！）

跟作者说两句

:wink: :twisted: :roll: :oops: :mrgreen: :lol: :idea: :evil: :cry: :arrow: :?: :-| :-x :-o :-P :-? :) :( :!: 8-O 8)

同类