选项卡是常用的GUI控件 ,自然不必再说,看其实现方式
<?xml version="1.0" encoding="utf-8"?> <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" creationComplete="init()" xmlns:views="views.*"> <fx:Script> <![CDATA[ import mx.controls.Alert; import mx.events.IndexChangedEvent; protected function init():void { tab.addEventListener(IndexChangedEvent.CHANGE,Tab_ItemChanged_Call); } protected function Tab_ItemChanged_Call(event:IndexChangedEvent):void { Alert.show(event.newIndex+"\n"+event.oldIndex+"\n"+tab.selectedChild.label); } ]]> </fx:Script> <fx:Declarations> <!-- Place non-visual elements (e.g., services, value objects) here --> </fx:Declarations> <s:Panel id="mix" verticalCenter="0" horizontalCenter="0" title="Mix"> <mx:TabNavigator id="tab" width="400" height="200"> <views:TVView label="TV"/> <views:ComputerView label="Computer"/> </mx:TabNavigator> </s:Panel> </s:Application>
填充使用的View内容如下
<?xml version="1.0" encoding="utf-8"?> <s:NavigatorContent xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" width="100%" height="100%"> <fx:Declarations> <!-- Place non-visual elements (e.g., services, value objects) here --> </fx:Declarations> <s:Panel title="TVs" width="100%" height="100%"> <s:layout> <s:VerticalLayout paddingTop="20" paddingBottom="20" paddingLeft="20" paddingRight="20"/> </s:layout> <s:Group width="100%" enabled="false"> <s:TextInput width="100%"/> <s:Button label="Search for channel"/> </s:Group> <s:Line width="100%"/> <s:Spacer height="10"/> <s:Label text="There are no channels avaiable."/> </s:Panel> </s:NavigatorContent>
<?xml version="1.0" encoding="utf-8"?> <s:NavigatorContent xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:s="library://ns.adobe.com/flex/spark" xmlns:mx="library://ns.adobe.com/flex/mx" width="100%" height="100%"> <fx:Declarations> <!-- Place non-visual elements (e.g., services, value objects) here --> </fx:Declarations> <s:Panel title="Computer" width="100%" height="100%"> <s:layout> <s:VerticalLayout paddingTop="20" paddingBottom="20" paddingLeft="20" paddingRight="20"/> </s:layout> <s:Group width="100%" enabled="false"> <s:TextInput width="100%"/> <s:Button label="Search for IBM"/> </s:Group> <s:Line width="100%"/> <s:Spacer height="10"/> <s:Label text="You can't afford a IBM..."/> </s:Panel> </s:NavigatorContent>
相关推荐
Flex4.6 带图标的TabNavigator的使用,这是个简单的列子供初学者学习一下。
这是一个封装好的flex项目,可以直接运行,TestTabNavigator.mxml是运行主页。里面定义了TabNavigator控件选中与被选中的皮肤类,皮肤类可以自己进行更改,也可以设置颜色渐变等等。希望对大家有帮助。
flex TabNavigator tab倒置
Flex3 排版为竖着的TabNavigator实例。
flex3 tabnavigator一个很好的例子
NULL 博文链接:https://zhangyinyou.iteye.com/blog/671128
Flex3 TabNavigator 可关闭tab简单实现
NULL 博文链接:https://kisscjy.iteye.com/blog/574873
NULL 博文链接:https://toeo.iteye.com/blog/644341
设置TabNavigator组件的标签头的自定义皮肤,可以设置样式等等,内容较少,只是提供一种自定义皮肤设置的思路
在FLEX中使用样式方法 2 一 .使用本地样式定义 2 二、使用外部样式表 3 三、使用内联样式 4 四、使用setStyle()方法 4 五、脚本方法 4 Application组件样式属性 5 panel组件样式属性 5 color文本颜色 6 TabNavigator...
主要介绍了Flex中TabNavigator如何设置Tabs样式有哪些思路,感兴趣的朋友可以看看下面的源码
在FLEX中使用样式方法 2 一 .使用本地样式定义 2 二、使用外部样式表 3 三、使用内联样式 4 四、使用setStyle()方法 4 五、脚本方法 4 Application组件样式属性 5 panel组件样式属性 5 color文本颜色 6 TabNavigator...
Flex中做得一个垂直button和一个含有垂直标签的TabNavigator
LinkButton | Menu | MenuBar | PopUpButton | PopUpMenuButton | ProgressBar | TabNavigator ToggleButtonBar | Tree | VScrollBar 为了方便使用,将Spark组件单独剥离出来,使用方案如下:(只限于spark组件) ...
在FlexBuilder中设置MXML编译器选项 1.5节.在FlexBuilder外部编译Flex项目 1.6节.在MXML中添加事件监听器 1.7节.设置子节点属性 1.8节.定义数组和对象 1.9节.在ActionScript中设置变量的作用域 1.10节.在...
包含flex4panel 不修改皮肤的圆角标题栏,According 控件缓慢展开,NavigaotrContent加icon,TabNavigator Tab头圆角和垂直空隙为0的调节. 外部字体导入和使用,app存放cookie的路径和本地线程调用的示例代码.
TabNavigator一个react-native 底部菜单
TabNavigator选项卡使用,里面包括flexlib库,还包括了一个公司自写的报表类库。flexlib库主要测试了整个框架、左边的树形菜单和右边的tabNabigator工作区使用。报表类库,主要是用到的报表实现。
感觉比flexlib.swc的SuperTabNavigator更好用