Welcome

首页 / 软件开发 / Flex / Flex基于数据源的Menu Tree

Flex基于数据源的Menu Tree2010-06-21 blogjava 实现功能:

1.由外部参数flashvars指定数据源的文件位置或render链接。

2.在源数据上加href和target属性来控制打开窗口。

3.可自定义父节点和子节点图标,不设置采用系统默认。

直接上源码:

<?xml version="1.0" encoding="utf-8"?>
...<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
... fontFamily="simsun" fontSize="12"
... layout="absolute" creationComplete="menu.send();" width="242" height="442" initialize="init()">
...<mx:Script>
... <![CDATA[
... import mx.controls.Alert;
... import mx.events.ListEvent;
... import mx.collections.ArrayCollection;
... import mx.rpc.events.ResultEvent;
...
... [Bindable]
... private var strUrl:String = "TreeMenus.xml";
...
... [Bindable]
... private var menus:XML;
...
... [Bindable]
... [Embed("open.gif")]
... public var openicon:Class;
...
... [Bindable]
... [Embed("close.gif")]
... public var closeicon:Class;
...
... [Bindable]
... [Embed("leaf.gif")]
... public var leaficon:Class;
...
... private function init():void
{
this.strUrl = this.parameters.url;
}
...
... private function LoadMenu(event:ResultEvent):void
{
menus = XML(event.result);
var results:XMLList = menus.node;
tree1.dataProvider = results;
}
... //菜单图标设置
... private function treeIcon(item:Object):Class
{

var node:XML = XML(item);
trace("icon:" + node.@icon);
var str : String = node.@icon;
//已经设置图标
if(node.hasOwnProperty("@icon"))
{
if(node.@icon == "openicon")
{
return openicon;
}
if(node.@icon == "closeicon")
{
return closeicon;
}
if(node.@icon == "leaficon")
{
return leaficon;
}
}
else
{
//如果没定义icon就直接用默认的
if(!tree1.dataDescriptor.isBranch(item))
{
return tree1.getStyle("defaultLeafIcon");
}
if(tree1.isItemOpen(item))
{
return tree1.getStyle("folderOpenIcon");
}
else
{
return tree1.getStyle("folderClosedIcon");
}
}
return null;
}
...
/** *//**
* 菜单树单项点击事件
* */
... private function itemClickHandler(evt:ListEvent):void
{
var item:Object = Tree(evt.currentTarget).selectedItem;
if (tree1.dataDescriptor.isBranch(item))
{
//tree1.expandItem(item, !groupTree.isItemOpen(item), true);
}
else
{
//得到节点对象
var node:XML = XML(item);
//如果有属性href
if(node.hasOwnProperty("@href") && node.hasOwnProperty("@target"))
{
openURL(node.@href,node.@target);
}
if(node.hasOwnProperty("@href") && (node.hasOwnProperty("@target") == false))
{
//没有指定target默认在新窗口中打开
openURL(node.@href,"_blank");
}
}
}
...
... //页面跳转的方法
... private function openURL(url:String ,target:String):void
{
var request:URLRequest = new URLRequest(url);
navigateToURL(request,target);
}
... ]]>
...</mx:Script>
... <mx:HTTPService url="{strUrl}" id="menu" useProxy="false"
... showBusyCursor="true" result="LoadMenu(event)" resultFormat="xml"/>
... <mx:Tree iconFunction="treeIcon" id="tree1" width="100%" height="100%" labelField="@label" itemClick="itemClickHandler(event)"/>
...</mx:Application>