flex 和 flexlib类库 实现 菜单和 TabNavigator (二)

解决 菜单重复打开问题..

按照以前的 思路自己保存一个 map 然后根据这个 map 里面的值.

来判断 是否已经打开标签.但是实际写的时候有点问题.

动态打开的标签的 children 数量 是不断减少的.

而用 delete 是删除不掉元素的.

但是发现 action的动态语言的灵活性还是挺强的.

于是 去查询文档找函数..

最后解决直接去访问 childern 里面的元素.

for each (var childTab:VBox in contentId.getChildren()){
                        if(childTab.label == myLabel){//只是通过标签名字判断.如果一样就直接打开标签.
                            contentId.selectedIndex = contentId.getChildIndex(childTab);
                            //跳转到指定标签.
                            return;
                        }
                    }

去判断 名字是否一致. 然后 通过.

contentId.getChildIndex(childTab);

可以得到 index.

这样标签选项就可以跳转过去了.

全部的 菜单代码.如下:

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" 
	xmlns:flexlib="http://code.google.com/p/flexlib/"
    width="100%" height="100%" pageTitle="我的系统测试." 
    initialize="sdk.send();" fontSize="12">

    <mx:Script>
        <![CDATA[
        	import flexlib.events.SuperTabEvent;
        	import mx.controls.SWFLoader;
        	import mx.containers.VBox;
        	import mx.controls.Label;
	        import flexlib.controls.SuperTabBar;
			import flexlib.events.TabReorderEvent;
			import flexlib.controls.tabBarClasses.SuperTab;
			import mx.controls.Alert;
			
			[Embed(source="./assets/document.png")]
			private var document_icon:Class;
			//tab左面的图标.
			private var nodeAppOpenMap:Object = new Object();
			//定义打开app类型数组.
			
	        private function treeChanged(event:Event):void
	        {//响应树点击的双击事件.
	            var nodeApp:String = compLibTree.selectedItem.@app;
	            var nodeLabel:String = compLibTree.selectedItem.@label;
	            //app是xml里面的定义的一个属性.
	            if (nodeApp != null && nodeApp != "")
	            {//如果有app这个属性.说明这个是一个叶子节点.开始加载那个flex文件.
	                addTab(nodeLabel, contentId, nodeApp);
	                //打开选项卡.带关闭按钮的选项卡.
	            }else{//如果里面没有app这个字段.说明这个是个文件夹.
	                compLibTree.expandItem(compLibTree.selectedItem, true, true);
	                //展开文件夹显示下面的内容.
	            }
	        }
	        
	        private function addTab(myLabel:String, navigator:SuperTabNavigator,nodeApp:String):void {
	        		//进行判断.看看新添加的childTab是否在getChildern()里面.如果有就打开.否则就新建.
	        		for each (var childTab:VBox in contentId.getChildren()){
	        			if(childTab.label == myLabel){//只是通过标签名字判断.如果一样就直接打开标签.
	        				contentId.selectedIndex = contentId.getChildIndex(childTab);
	        				//跳转到指定标签.
		        			return;
	        			}
	        		}
	        		
	        		var swfLoader:SWFLoader = new SWFLoader();
	        		//动态加载flex类.在这里进行定义.每一个table新建立一个实例.
					var curNum:Number = contentId.numChildren + 1;
					var child:VBox = new VBox();
					child.setStyle("closable", true);
					//设置选项卡可以关闭.
					child.label = myLabel;
					//设置选项卡的名称.
					child.icon = document_icon;
					//设置选项卡的左面的文档图标.
					swfLoader.source = nodeApp + ".swf";
					//开始动态加载swf文件.
					child.addChild(swfLoader);
					navigator.addChild(child);
					//将加载后的swf类放到child里面,再放到navigator里面.
					contentId.selectedIndex = contentId.numChildren - 1;
			}
	        
	        private function sdkLoaded():void
	        {
	            explorerTree = XML(sdk.lastResult.node);
	            compLibTree.dataProvider = explorerTree;
	        }
        ]]>
    </mx:Script>


    <mx:HTTPService id="sdk" url="explorer.xml" resultFormat="e4x" result="sdkLoaded();"/>
    <mx:XML id="explorerTree"/>

    <mx:HDividedBox width="100%" height="100%">
        <mx:Panel width="30%" height="100%" title="测试菜单">
            <mx:Tree id="compLibTree" width="100%" height="100%" showRoot="false" labelField="@label"
            change="treeChanged(event);"/>
        </mx:Panel>
        
		<flexlib:SuperTabNavigator id="contentId" scrollSpeed="25" dropShadowEnabled="false"
			width="100%" height="100%" horizontalGap="0"
			closePolicy="{SuperTab.CLOSE_ALWAYS}" dragEnabled="false" dropEnabled="false"
			tabWidth="160"
		/>
		
    </mx:HDividedBox>
</mx:Application>

总结:

因为是类.是组件的缘故.所以 可以直接访问到属性.

方法.

是 Container 的方法和属性.