`

flex TabNavigator 切换之前给出提示(转)

    博客分类:
  • Flex
阅读更多

<?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>

分享到:
评论

相关推荐

    Flex3 TabNavigator

    在Flex3中,TabNavigator是一种容器控件,用于展示多个视图,并且这些视图可以通过标签页进行切换。TabNavigator的每个标签页通常关联一个ViewStack或其他容器,用于存放不同的内容。然而,标准的TabNavigator并不...

    Flex视图切换,自定义控件Demo.rar

    在Flex中,视图切换和自定义控件是构建用户界面时的重要技术,它们极大地增强了用户体验和交互性。 视图切换是Flex应用程序中常见的功能,允许用户在多个界面或工作区之间进行导航。这在多页面或模块化的应用中非常...

    flex组件介绍

    Flex不仅提供了容器组件,还有一系列的导航控件,如`TabNavigator`和`Navigator`,用于在不同的内容区域之间进行切换。这些控件对于构建复杂的应用程序界面非常有用,尤其是当需要在多个页面或视图之间导航时。 ###...

    Flex从入门到实践2

    【Flex从入门到实践2】深入理解Flex中的导航与菜单设计 在Flex开发中,良好的导航设计对于提升用户体验至关重要。本章重点介绍了三种常见的导航组件:ViewStack、TabNavigator和Accordion,以及它们在构建应用程序...

    Flex相册

    开发环境中,开发者可能使用Adobe Flash Builder或者IntelliJ IDEA等集成开发环境,它们提供了图形化的界面和代码提示,简化了Flex应用的开发流程。 2. **MXML与ActionScript**:Flex应用的界面通常由MXML文件定义...

    Flex 电子相册

    7. **状态管理**:Flex电子相册可能包含多种状态,如查看模式、编辑模式等,状态管理允许在不同模式之间轻松切换,提供不同的用户体验。 8. **用户交互设计**:良好的用户交互设计是电子相册成功的关键。这包括合理...

    flex3动态创建[参考].pdf

    - `mx:TabNavigator` 是一个容器,它允许用户通过标签在多个视图之间切换。 - `mx:Canvas` 作为基本容器,可以添加和组织其他组件。 2. **数据绑定和事件处理**: - `creationComplete` 事件在组件完成创建后...

    Flex UI组件使用全集

    以上列出的只是部分Flex UI组件,这些组件为开发者提供了广泛的选择,使得创建复杂且美观的应用程序成为可能。理解这些组件的功能和使用方法对于构建高效、响应式的RIA至关重要。通过熟练掌握这些组件,开发者能够...

    Flex 3 组件实例与应用(2009版)

    在深入了解各个组件之前,我们需要先了解Flex 3的一些基础知识。Flex 3是基于ActionScript 3.0的一种开放源代码框架,用于构建跨平台的富互联网应用程序(RIA)。它提供了丰富的UI组件库以及强大的数据绑定和网络...

    react-native-rapi-ui:React Native组件库

    2. **导航组件**:导航是移动应用中至关重要的部分,Rapi UI 提供了如`StackNavigator`、`TabNavigator`和`DrawerNavigator`等导航解决方案,帮助开发者实现页面间的跳转和切换,确保用户在应用中的流畅体验。...

Global site tag (gtag.js) - Google Analytics