Flex tabNavigator 的初级应用



<?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/"
creationComplete="init()" fontSize="12">
<mx:Script>
<![CDATA[
import flexlib.controls.tabBarClasses.SuperTab;
import flexlib.events.SuperTabEvent;
import mx.containers.dividedBoxClasses.BoxDivider;
import mx.controls.Alert;
import mx.controls.Button;
import mx.core.EventPriority;
import mx.events.FlexEvent;
private var tabMenu:ContextMenu;
private var close_cur:String="关闭当前页";
private var close_other:String="关闭其他页";
private var close_all:String="关闭所有页";
private var closeTabItem:ContextMenuItem;
private var closeOthersItem:ContextMenuItem;
private var closeAllItem:ContextMenuItem;
[Embed(source="assets/home.png")]
private var home_icon:Class;
[Embed(source="assets/app.png")]
private var app_icon:Class;
private function init():void{
this.initCompents();
this.addTabNavigator();
//延后执行
callLater(addTabMenu);
this.addGuiListeners();
}
//初始化某些组件
private function initCompents():void{
tabMenu = new ContextMenu();
closeTabItem = new ContextMenuItem(close_cur);
closeOthersItem = new ContextMenuItem(close_other);
closeAllItem = new ContextMenuItem(close_all);
tabMenu.hideBuiltInItems();
tabMenu.customItems.push(closeTabItem);
tabMenu.customItems.push(closeOthersItem);
tabMenu.customItems.push(closeAllItem);
//处理中间分隔条
var bdriver:BoxDivider=this.hdbox.getDividerAt(0);
bdriver.doubleClickEnabled=true;
bdriver.addEventListener(MouseEvent.DOUBLE_CLICK, maxsizeHandler);
}
//添加几个tab页
private function addTabNavigator():void{
for(var i:uint=0;i<5;i++ ){
var vbox:VBox=new VBox();
vbox.label="Tab"+i;
if(i==0){
vbox.label="首页";
vbox.icon=home_icon;
}else
vbox.icon=app_icon;
tabs.addChild(vbox);
}
}
//给tab页添加菜单
private function addTabMenu():void{
//设置首页不可关闭
this.tabs.setClosePolicyForTab(0,SuperTab.CLOSE_NEVER);
for(var i:uint=0;i<tabs.getChildren().length;i++){
var tabBtn:Button=tabs.getTabAt(i);
//添加双击tab页事件监听
tabBtn.addEventListener(MouseEvent.DOUBLE_CLICK,maxsizeHandler);
tabBtn.contextMenu=tabMenu;
}
}
private function addGuiListeners():void{
closeTabItem.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT,tabRightMenuHandler);
closeOthersItem.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT,tabRightMenuHandler);
closeAllItem.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT,tabRightMenuHandler);
tabMenu.addEventListener(ContextMenuEvent.MENU_SELECT,tabMenuHandler);
this.tabs.addEventListener(SuperTabEvent.TAB_CLOSE,closeSuperTabHandler);
}
//取消双击tab页事件的监听
private function closeSuperTabHandler(ev:SuperTabEvent):void{
var tabIdx:Number = ev.tabIndex;
var tabBtn:Button=tabs.getTabAt(tabIdx);
tabBtn.removeEventListener(MouseEvent.DOUBLE_CLICK,maxsizeHandler);
}
//最大化
private function maxsizeHandler(ev:Event):void{
if(this.leftBox.percentWidth==0){
this.leftBox.percentWidth=20;
this.rightBox.percentWidth=80;
}else{
this.leftBox.percentWidth=0;
this.rightBox.percentWidth=100;
}
}
//处理tab右键关闭事件
private function tabRightMenuHandler(ev:ContextMenuEvent):void{
var cap:String = (ev.target as ContextMenuItem).caption;
var home:* = this.tabs.getChildAt(0);
var idx:int;
switch(cap){
case close_cur:
idx = this.tabs.selectedIndex;
if(idx >= 0)
this.tabs.removeChildAt(idx);
break;
case close_other:
var selected:* = this.tabs.selectedChild;
for each(var cnt:* in this.tabs.getChildren()){
if(cnt != selected && cnt != home){
this.tabs.removeChild(cnt);
}
}
break;
case close_all:
// this.tabs.removeAllChildren();
for each(var tab:* in this.tabs.getChildren()){
if(tab != home)
this.tabs.removeChild(tab);
}
break;
}
}
private function tabMenuHandler(ev:ContextMenuEvent):void{
var tag:DisplayObject=ev.mouseTarget as DisplayObject;
var idx:uint=this.tabs.selectedIndex;
if(tag){
//下面这句非常犀利,发送一个单击事件
tag.dispatchEvent(new MouseEvent(MouseEvent.CLICK));
closeTabItem.visible = true;
closeOthersItem.visible = true;
closeAllItem.visible = true;
if(idx==0)
closeTabItem.enabled = false;
else
closeTabItem.enabled = true;
if(this.tabs.numChildren==1 || (this.tabs.numChildren==2 && idx>0))
closeOthersItem.enabled = false;
else
closeOthersItem.enabled = true;
if(this.tabs.numChildren==1 && idx==0)
closeAllItem.enabled = false;
else
closeAllItem.enabled = true;
return;
}
closeTabItem.visible = false;
closeOthersItem.visible = false;
closeAllItem.visible = false;
}
]]>
</mx:Script>
<mx:VBox width="100%" height="100%">
<mx:Spacer height="20" />
<mx:HDividedBox id="hdbox" width="100%" height="80%" liveDragging="true">
<mx:VBox id="leftBox" width="20%" height="100%">
<mx:Tree width="100%" height="100%"/>
</mx:VBox>
<mx:VBox id="rightBox" width="80%" height="100%">
<flexlib:SuperTabNavigator id="tabs" width="100%" height="100%" creationPolicy="all" paddingTop="1">
</flexlib:SuperTabNavigator>
</mx:VBox>
</mx:HDividedBox>
</mx:VBox>
</mx:Application>