当前位置: 代码迷 >> Web前端 >> Mx Tree Control 树节点图标变化
  详细解决方案

Mx Tree Control 树节点图标变化

热度:114   发布时间:2012-10-27 10:42:26.0
Mx Tree Control 树节点图标变更
1。树节点图标设置
2。指定树节点的图标变更
<?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" 
			   minWidth="955" minHeight="600"
			   creationComplete="initApp();">  
	
	<!-- ====== Properties of parent ======================= -->  
	<s:layout>
		<s:BasicLayout/>
	</s:layout>   
	
	<!-- ====== MetaData =================================== -->  
	
	<!-- ====== Styles ===================================== -->  
	
	<!-- ====== Script ===================================== -->  
	<fx:Script>
		<![CDATA[
			import mx.collections.XMLListCollection;
			import mx.core.FlexGlobals;
			import mx.events.FlexEvent;
			
			[Bindable]
			[Embed(source="images/info.gif")]
			public var infoImg:Class;

			[Bindable]
			[Embed(source="images/169.gif")]
			public var defImg:Class;

			
			[Bindable]
			private var treeData:XML =
				<root>
					<node label="Monkeys">
						<node label="South America" >
							<node label="Coastal"/>
							<node label="Inland"/>
						</node>
						<node label="Africa" isBranch="true" />
						<node label="Asia" isBranch="true"/>
					</node>
					<node label="Sharks">
						<node label="South America" isBranch="true"/>
						<node label="Africa" isBranch="true"/>
						<node label="Asia" >
							<node label="Coastal"/>
							<node label="Inland"/>
						</node>
					</node>
				</root>;
			
			private var openSequence:Array = [];
			private function initApp():void {
				/* Parse URL and place values into openSequence Array.
				This lets you pass any integers on the query string,
				in any order. So:
				http://localhost/flex/flex2/DrillIntoTree.swf?0=1&1=2&2=0
				
				http://localhost:8080/FlexWeb/FlexWeb-debug/TreeDemo4.swf?0=1&1=2&2=0
				
				results in an array of selections like this:
				0:1
				1:2
				2:0
				Non-ints are ignored.
				The Array is then used to drill down into the tree.
					*/
			var paramLength:int = 0;
			for (var s:String in FlexGlobals.topLevelApplication.parameters) {
				if (!isNaN(Number(s))) {
					openSequence[s] = FlexGlobals.topLevelApplication.parameters[s];
					paramLength += 1;
				}
			}
			openTree();
			}
			private function openTree():void {
				var nodeList:XMLListCollection =
					myTree.dataProvider as XMLListCollection;
				var node:XMLList = nodeList.source;
				for(var i:int=0; i < openSequence.length; i++) {
					var j:int = openSequence[i];
					var n:XML = node[j];
					if( n.children() != null ) {
						// 如果有子节点,打开子节点						
						myTree.expandItem(n,true,false);
						node = n.children();
					} else {
						break;
					}
				}
				if( n != null ) myTree.selectedItem = n;
			}
			
			// 甚至指定节点的图标			
			private function setIcons():void {
				myTree.setItemIcon(myTree.dataProvider.getItemAt(0),
					infoImg, defImg);
				myTree.setItemIcon(myTree.dataProvider.getItemAt(1),
					infoImg, null);
			}


			protected function myTree_initializeHandler(event:FlexEvent):void
			{
				setIcons();
				//选择指定节点
				myTree.selectedIndex = 2;
 			}

		]]>
	</fx:Script>
	
	<!-- ====== Declarations =============================== -->  
	<fx:Declarations>
		<!-- 将非可视元素(例如服务、值对象)放在此处 -->
	</fx:Declarations>   
	
	<!-- ====== UI Components ============================== -->     
	<mx:Tree id="myTree"
			 y="50"
			 width="221"
			 height="257"
			 horizontalCenter="0"
			 dataProvider="{treeData.node}"
			 labelField="@label"
			 iconField="@icon"
			 folderOpenIcon="@Embed(source='images/open.gif')"
			 folderClosedIcon="@Embed(source='images/close.gif')"
  			 defaultLeafIcon="{defImg}"
			 initialize="myTree_initializeHandler(event)"
			 />

</s:Application>

1 楼 zjb_0308 2011-03-03  
厉害啊~~看了几篇大哥写的关于flex的文章,就能上手了,多谢多谢!
  相关解决方案