Flex中TabNavigator隐藏和显示选项卡

1、问题背景

遇到这样一个问题：有四个Tab选项卡。依据不同的參数隐藏和显示选项卡

2、实现实例

（1）隐藏“春季”

protected function springClickHandler(event:MouseEvent):void
{
	tabs.getTabAt(0).visible = false;
	tabs.getTabAt(0).includeInLayout = false;
	tabs.getTabAt(1).visible = true;
	tabs.getTabAt(1).includeInLayout = true;
	tabs.getTabAt(2).visible = true;
	tabs.getTabAt(2).includeInLayout = true;
	tabs.getTabAt(3).visible = true;
	tabs.getTabAt(3).includeInLayout = true;
	tabs.selectedIndex = 1;
}

（2）隐藏“夏季”

protected function summerClickHandler(event:MouseEvent):void
{
	tabs.getTabAt(0).visible = true;
	tabs.getTabAt(0).includeInLayout = true;
	tabs.getTabAt(1).visible = false;
	tabs.getTabAt(1).includeInLayout = false;
	tabs.getTabAt(2).visible = true;
	tabs.getTabAt(2).includeInLayout = true;
	tabs.getTabAt(3).visible = true;
	tabs.getTabAt(3).includeInLayout = true;
	tabs.selectedIndex = 0;
}

（3）隐藏“秋季”

protected function autumnClickHandler(event:MouseEvent):void
{
	tabs.getTabAt(0).visible = true;
	tabs.getTabAt(0).includeInLayout = true;
	tabs.getTabAt(1).visible = true;
	tabs.getTabAt(1).includeInLayout = true;
	tabs.getTabAt(2).visible = false;
	tabs.getTabAt(2).includeInLayout = false;
	tabs.getTabAt(3).visible = true;
	tabs.getTabAt(3).includeInLayout = true;
	tabs.selectedIndex = 0;
}

（4）隐藏“冬季”

protected function winterClickHandler(event:MouseEvent):void
{
	tabs.getTabAt(0).visible = true;
	tabs.getTabAt(0).includeInLayout = true;
	tabs.getTabAt(1).visible = true;
	tabs.getTabAt(1).includeInLayout = true;
	tabs.getTabAt(2).visible = true;
	tabs.getTabAt(2).includeInLayout = true;
	tabs.getTabAt(3).visible = false;
	tabs.getTabAt(3).includeInLayout = false;
	tabs.selectedIndex = 0;
}

（5）显示“四季”

protected function fourClickHandler(event:MouseEvent):void
{
	tabs.getTabAt(0).visible = true;
	tabs.getTabAt(0).includeInLayout = true;
	tabs.getTabAt(1).visible = true;
	tabs.getTabAt(1).includeInLayout = true;
	tabs.getTabAt(2).visible = true;
	tabs.getTabAt(2).includeInLayout = true;
	tabs.getTabAt(3).visible = true;
	tabs.getTabAt(3).includeInLayout = true;
	tabs.selectedIndex = 0;
}

3、实例结果

（1）初始化

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQveW91MjNoYWk0NQ==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" width="710" height="396" border="1" >

（2）点击“春季”button

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQveW91MjNoYWk0NQ==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" width="710" height="392" border="1" >

（3）点击“夏季”button

（4）点击“秋季”button

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQveW91MjNoYWk0NQ==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" width="710" height="393" border="1" >

（5）点击“冬季”button

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQveW91MjNoYWk0NQ==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" width="710" height="395" border="1" >

（6）点击“四季”button

时间： 2024-12-20 18:46:40

Flex中TabNavigator隐藏和显示选项卡的相关文章

android ListView条目中TextView隐藏到显示时的测量

觉得ExpendableListView挺好用,但是就是代码复杂了点,我一时半会理解不了,于是就直接自己写个效果来实现.先来看一下expendableListView中展开的动画效果: 然后我模仿此效果,建立如下的item布局: <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"     android:layout_width="match_parent" andr

AngularJS中的隐藏和显示

var myApp=angular.module('myApp',[]) myApp.controller('ShowController', function($scope){ $scope.menuState = { show: false } $scope.toggleMenu = function(){ $scope.menuState.show = !$scope.menuState.show; } } ng-show和ng-hide这两条指令的功能是等价的,但是运行效果正好相反,我们

重写UITableViewCell子类中属性的setter方法来实现隐藏或显示该cell中的某些控件

为什么会需要这样子的一种方法来实现隐藏或者显示一个cell中的某些控件呢? 其实,隐藏cell中某些控件可以直接在tableView:cellForRowAtIndexPath:方法中直接实现,我们需要判断外部变量比如bool值来决定是否显示这个控件,但需要额外的代码写在tableView:cellForRowAtIndexPath:方法当中,如果我们把bool值传递给该cell让其自己判断是否显示隐藏这个控件,可读性将会大幅增加:) 效果: 源码: YXCell.h // // YXCell.

html中实现数据的显示和隐藏

Author: YangQingQing <!DOCTYPE html><html><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><head><title>demo</title><script>var obj = document.getElementById("div_id&qu

flex中toolTip汇总 转

1.toolTip换行符 <mx:Button id="btn1" toolTip="在工具条提示中 使用换行符"/> 2.设定工具条提示的样式 [javascript] view plaincopy <mx:Style> ToolTip { fontSize:19; color:#FF6699; } </mx:Style> 3.设定工具提示宽度 [javascript] view plaincopy <mx:Applica

CAD编辑器中怎么隐藏图纸中标注的尺寸

在建筑设计师们编辑CAD图纸的时候,都会对每一张CAD图纸中的内容进行标注尺寸,但是在我们交给客户查看CAD图纸的时候,标注有尺寸的CAD图纸看起来不是那么的美观,那我们怎么隐藏CAD图纸中标注的尺寸呢?具体要怎么操作?下面小编就教教大家在迅捷CAD编辑器标准版中查看CAD图纸文件时,怎么隐藏图纸中标注的尺寸. 第一步:首先在电脑中任选一个浏览器,在浏览器中搜索迅捷CAD编辑器(标准版),进入官网点击下载最新版本的CAD编辑器,然后双击软件进入到软件的操作窗口. 第二步:编辑器打开之后,在软件顶

Eclipse ADT中的logcat不显示解决方法

Eclipse ADT中的logcat不显示解决方法: 1.在Eclipse界面中找到DDMS,然后找到device选项卡,在这个选项卡中选择reset adb,如果不行尝试方法2: 2.不用关闭eclipse和模拟器,在Android SDK的tools目录下有个 ddms.bat 批处理文件,运行这个文件可以启动DDMS,同时这里面有logcat,可以显示信息: 3.以上方法都不行,最终杀手锏就是重启eclipse,重启模拟器,记得在任务管理器中关闭adb.exe,这时应该就可以了. 4.用

jQuery效果：隐藏、显示、切换、滑动、淡入淡出、动画

jQuery效果 隐藏.显示.切换.滑动.淡入淡出.以及动画 1.隐藏与显示(改变:display:none;) hide()--隐藏 show()--显示 toggle()方法:可以使用它来切换hide()与show()方法 eg1:显示 <style type="text/css"> *{margin:0;padding:0;} .body{font-size:12px;font-family:"微软雅黑";color:#666;} .yym{wid

动画基础隐藏和显示 (jQuery)

1jQuery中隐藏元素的hide方法 让页面上的元素不可见,一般可以通过设置css的display为none属性.但是通过css直接修改是静态的布局,如果在代码执行的时候,一般是通过js控制元素的style属性,这里jQuery提供了一个快捷的方法.hide()来达到这个效果 $elem.hide() 提供参数: .hide( options ) 当提供hide方法一个参数时,.hide()就会成为一个动画方法..hide()方法将会匹配元素的宽度,高度,以及不透明度,同时进行动画操作 快捷参