我的应用程序有 3 类按钮,我想要一个选项卡式面板,可以用来在 3 类之间切换,如下所示example:
我的应用程序是一个移动应用程序,所以我不能使用 mx 组件。当我尝试搜索移动选项卡式导航等时,我只提出了 viewnavigator 示例。
对于移动选项卡式应用程序,您只需使用TabbedViewNavigator应用程序 class:
第一种方法
您的视图只是使用 MXML 组件<s:View>
作为根音。
阅读您的评论,我发现您希望在视图中添加一个选项卡栏。在普通 Flex 中,您可以使用TabBar
并将其附加到ViewStack
but ViewStack
在移动设备中不可用...因此您可以即兴使用状态,绑定TabBar
状态名称并根据状态隐藏/显示面板。这是一个例子:
第二种方法*
<s:View xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark" title="HomeView">
<s:layout>
<s:VerticalLayout />
</s:layout>
<s:states>
<s:State name="One" />
<s:State name="Two" />
<s:State name="Three" />
</s:states>
<s:TabBar id="tabBar" width="100%"
change="currentState = tabBar.dataProvider[event.newIndex]">
<s:ArrayCollection>
{states.map(function(x) { return x.name; }) }
</s:ArrayCollection>
</s:TabBar>
<s:Group includeIn="One" width="100%" height="100%">
<s:Label text="Tab One" />
</s:Group>
<s:Group includeIn="Two" width="100%" height="100%">
<s:Label text="Tab Two" />
</s:Group>
<s:Group includeIn="Three" width="100%" height="100%">
<s:Label text="Tab Three" />
</s:Group>
</s:View>
但是,您可能仍然希望保留移动选项卡导航功能,但仅适用于一种特定视图。您可以包括一个TabbedViewNavigator
在你的视图里面而不是使用TabbedViewNavigatorApplication
.
第三种方法
<s:View xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark" title="HomeView">
<s:TabbedViewNavigator width="100%" height="100%">
<s:ViewNavigator label="1st Tab" width="100%" height="100%"
firstView="views.FirstTabView"/>
<s:ViewNavigator label="2nd Tab" width="100%" height="100%"
firstView="views.SecondTabView"/>
<s:ViewNavigator label="3rd Tab" width="100%" height="100%"
firstView="views.ThirdTabView"/>
</s:TabbedViewNavigator>
</s:View>
您将获得一个嵌套的“操作栏”,因此您可以通过设置禁用每个选项卡视图中的嵌套操作栏actionBarVisible="false"
希望这可以帮助!!!!
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)