flex TabNavigator 切换之前给出提示

下面代码是我做的例子:

 

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
  creationComplete="init()">
<mx:Script>
 <![CDATA[
  import mx.controls.TabBar;
  import mx.controls.Button;
  import mx.controls.Alert;
  import mx.events.CloseEvent;
  import mx.managers.PopUpManager;
  
  private var iTabIndex:int;
  private var iToTabIndex:int;
  private var _updateAlert:Alert;
  
  public function init():void
  {
   iTabIndex = 0;
   iToTabIndex = 0;
   var btn:Button;
   for(var i:int=0;i<tab.getChildren().length;i++)
   {
    btn = tab.getTabAt(i);
    btn.addEventListener(MouseEvent.MOUSE_DOWN,tabClickHandler,false,999999999);
   }
  }
  private function tabClickHandler(event:MouseEvent):void
     {
         iToTabIndex = event.currentTarget.parent.getChildIndex(event.currentTarget);
         //终止事件
         event.stopImmediatePropagation();
         //给出提示message
         if(iToTabIndex !=iTabIndex)
         {
          showGoBack();
         }
     }
     // alert
  public function showGoBack():void
  {
   Alert.buttonWidth = 100;
   Alert.yesLabel    = "yes";
   Alert.noLabel     = "no";
   var updateLabel:String =  "要切换tab吗?";

   this._updateAlert = Alert.show(updateLabel, "", Alert.YES | Alert.NO);
   this._updateAlert.addEventListener(CloseEvent.CLOSE,closeShowGoBack); 
  }
  private function closeShowGoBack(e:CloseEvent):void
  {
   switch (e.detail)
   {
    case Alert.YES:            
     iTabIndex    = iToTabIndex;
     tab.selectedIndex   = iTabIndex;
     break;
    case Alert.NO:
     PopUpManager.removePopUp(this._updateAlert);
     break;
   }   
  }
  
  public function change(e:Event):void
  {
   Alert.show("CHANGE " + tab.selectedIndex.toString() + "!!!");
   
  }
  //注释;creationPolicy="all",把tab的所有child全部初始化
  
  
 ]]>
</mx:Script>
 <mx:TabNavigator creationPolicy="all" id="tab" x="21" y="28" change="change(event)" width="200" height="200" >
  <mx:Canvas id="a" label="aa" width="100%" height="100%">
   <mx:TextInput x="10" y="10" width="178"/>
  </mx:Canvas>
  <mx:Canvas id="b" label="bb" width="100%" height="100%">
   <mx:Button id="abtn" x="10" y="50" label="Button"/>
  </mx:Canvas>
 </mx:TabNavigator>
</mx:Application>

 

注意:本代码是本人发了多半天的时间,查文档,解决的。如果有人引用,请注明地址,谢谢!

你可能感兴趣的:(navigator)