且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

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

更新时间:2022-08-13 11:17:04

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

 

按照以前的 思路自己保存一个 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 的方法和属性.