在 Flex 选项卡式视图导航器之间切换答案

【问题标题】：Switch between Flex Tabbed ViewNavigators在 Flex 选项卡式视图导航器之间切换
【发布时间】：2011-05-25 00:35:40
【问题描述】：

我正在开发带有三个选项卡（ViewNavigator 元素）的 Flex TabbedViewNavigatorApplication。我想根据用户操作（通过 ActionScript 代码）从一个 ViewNavigator 切换到另一个。

我知道在视图之间切换使用 pushView 和 popView，但我正在使用 ViewNavigator，我的搜索显示没有任何用处。

我正在尝试在事件发生时从 Tab2 切换到 Tab1。在这种情况下，Tab2 包含一个列表，当用户进行选择时，我想跳回 Tab1。

<s:TabbedViewNavigatorApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
                                  xmlns:s="library://ns.adobe.com/flex/spark"
                                  creationComplete="onAppReady(event)">
    <s:ViewNavigator label="Tab1" width="100%" height="100%" firstView="views.TabOneView"/>
    <s:ViewNavigator label="Tab2" width="100%" height="100%" firstView="views.TabTwoView"/>
    <s:ViewNavigator label="Tab3" width="100%" height="100%" firstView="views.TabThreeView"/>
</s:TabbedViewNavigatorApplication>

感谢您的帮助！

【问题讨论】：

标签： apache-flex actionscript-3 blackberry-playbook

【解决方案1】：

我使用以下 ActionScript 行根据用户操作从一个 ViewNavigator 切换到另一个：

TabbedViewNavigator(navigator.parentNavigator).selectedIndex = 1;

它就像一个魅力，看起来比冒泡事件更简单。

【讨论】：

【解决方案2】：

这个类奇怪地没有记录。我自己没有尝试过，但是通过在线搜索，this is what I found 证实了网络其他部分的做法。

您需要做的是将事件冒泡到TabbedViewNavigatorApplication，然后从那里将selectedIndex 属性更改为您需要更改的任何选项卡。例如：

<s:TabbedViewNavigatorApplication xmlns:fx="http://ns.adobe.com/mxml/2009" 
                                  xmlns:s="library://ns.adobe.com/flex/spark"
                                  creationComplete="onCreationComplete()">
    <fx:Script>
        <![CDATA[
            private function onCreationComplete():void
            {
                this.addEventListener('someEvent', someHandler);
            }

            private function someHandler(e:Event):void
            {
                this.selectedIndex = 0; // or whatever index you want. 
            }
        ]]>
    </fx:Script>
    <s:ViewNavigator label="Tab1" width="100%" height="100%" firstView="views.TabOneView"/>
    <s:ViewNavigator label="Tab2" width="100%" height="100%" firstView="views.TabTwoView"/>
    <s:ViewNavigator label="Tab3" width="100%" height="100%" firstView="views.TabThreeView"/>
</s:TabbedViewNavigatorApplication>

您只需要从您的孩子内部分派一个冒泡事件。您可以创建一个自定义事件来保存有关切换到哪个选项卡的数据。

【讨论】：