flex 树型结构右键菜单和图标

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
			   xmlns:s="library://ns.adobe.com/flex/spark"
			   xmlns:mx="library://ns.adobe.com/flex/mx"
			   creationComplete="init()">
	<fx:Declarations>
		<!-- Place non-visual elements (e.g., services, value objects) here -->
	</fx:Declarations>
	<fx:Script>
		<![CDATA[
			import mx.controls.Alert;
			
			private var iconArr:Array = new Array();
			private var menuItem:ContextMenuItem;
			
			[Embed(source="/assets/images/Buttonclose.png")]
			[Bindable]
			private var icon_oa:Class;
			
			[Embed(source="/assets/images/Buttonclose.png")]
			[Bindable]
			private var icon_1:Class;
			
			[Embed(source="/assets/images/Buttonclose.png")]
			[Bindable]
			private var icon_3:Class;
			
			[Embed(source="/assets/images/Buttonclose.png")]
			[Bindable]
			private var icon_2:Class;
			
			[Embed(source="/assets/images/Buttonclose.png")]
			[Bindable]
			private var icon_4:Class;
			
			[Embed(source="/assets/images/Buttonclose.png")]
			[Bindable]
			private var icon_5:Class;
			
			[Bindable]
			private var xml:XML=
				<node icon="oa" label="办公自动化">
					<node label="公文管理">
						<node id="1" icon="icon1" label="公文收发" />
						<node id="2" icon="icon1" label="公文归档"/>
						<node id="3" icon="icon1" label="公文查询"/>
						<node id="4" icon="icon1" label="通知公告"/>
					</node>
					<node label="人事管理">
						<node label="历史数据查询">
							<node id="5" icon="icon2" label="离职人员查询"/>
						</node>
						<node label="新员工入职">
							<node id="6" icon="icon3" label="基本信息"/>
							<node id="7" icon="icon3" label="员工转正"/>
						</node>
						<node label="工资管理">
							<node id="8" icon="icon4" label="设置公式"/>
							<node id="9" icon="icon4" label="工资发放"/>
						</node>
					</node>
					<node label="决策支持">
						<node id="11" icon="icon5" label="规则设置"/>
					</node>
				</node>
			
			private function init():void{
				iconArr["oa"]=icon_oa;
				iconArr["icon1"]=icon_1;
				iconArr["icon2"]=icon_2;
				iconArr["icon3"]=icon_3;
				iconArr["icon4"]=icon_4;
				iconArr["icon5"]=icon_5;
				this.expendAllTreeNode();
				this.addTreeMenu();
				tree.contextMenu.addEventListener(ContextMenuEvent.MENU_SELECT,rightClickHandler);
			}
			
			/*
			* 展开树
			*/
			public function expendAllTreeNode(): void {
				tree.validateNow();
				tree.selectedIndex = 0;
				tree.expandChildrenOf(tree.selectedItem,true);
			}
			
			/*
			* 添加右键菜单
			*/
			public function addTreeMenu():void{
				var menu:ContextMenu=new ContextMenu();
				menu.hideBuiltInItems();
				menuItem=new ContextMenuItem("打开");
				menuItem.visible=false;
				menu.customItems.push(menuItem);
				tree.contextMenu=menu;
			}
			
			/*
			* 设置节点图标
			*/
			private function setIcon(item:Object):Class{
				var node:XML = item as XML;
				var nodeIcon:String = node.@icon;
				if(node!=null && nodeIcon!=null && nodeIcon.length!=0)
					return iconArr[nodeIcon];
				else
					return null;
			}
			
			/*
			* 处理右键事件
			*/
			private function rightClickHandler(ev:ContextMenuEvent):void{
				menuItem.visible=false;
				var tag:Object=ev.mouseTarget;
				//右键时行选中，此处需捕获异常
				try{
					if(tag && tag.parent && tag.parent.data && (tag.parent.data is XML))
						tree.selectedItem = tag.parent.data;
				}catch(ex:Error){
				}
				
				var node:XML = tree.selectedItem as XML;
				if(node!=null && node.@id!=null){
					var nodeId:String = node.@id;
					if(nodeId.length>0)
						menuItem.visible = true;
				}
			}
		]]>
	</fx:Script>
	<s:HGroup width="30%" height="100%">
		<mx:Tree id="tree" width="100%" height="100%" dataProvider="{xml}"
				 labelField="@label" iconFunction="setIcon" />
	</s:HGroup>
</s:Application>

 

评论

1 楼 bluesummer 2011-08-01  

试了，不行。奇怪。