tabpanel是extjs中一种比较常用的布局容器控件,也比较简单。

        ///1:相关的插件,
var tabScrollerMenu = Ext.create("Ext.ux.TabScrollerMenu", {
maxText: 15,
pageSize: 100
});
var tabReorderer = Ext.create('Ext.ux.TabReorderer');
var tabClosePlugin = Ext.create('Ext.ux.TabCloseMenu', {
closeTabText: '关闭',
closeOthersTabsText: '关闭其他页签',
closeAllTabsText: '关闭所有页签'
}); ///2:创建页签容器,内容容器,放置各种控件或者是html
zhuUx.tabs = Ext.widget('tabpanel', {
activeTab: 0,
floating: false,
plugins: [tabScrollerMenu, tabClosePlugin, tabReorderer],
region: 'center',
collapseMode: "undefined",
listeners: {
tabchange: {
scope: zhuUx,
fn: zhuUx.mainTabChanged
}
},
defaults: {
bodyPadding: 1
},
items: []
}); /// 3:动态加入页签,避免重复加入页签,
/// 解决办法是给每个页签加上唯一标记属性,
/// 判断一下唯一标识是否存在,存在则不添加了
var currentTabsCount = zhuUx.tabs.items.length;
for (i = 0; i < currentTabsCount; i++) {
if (zhuUx.tabs.items.getAt(i).businessObjectId == businessObjectId) {
zhuUx.tabs.setActiveTab(i);
return;
}
}
var dataManagerPanel = Ext.create(zhuUx.itemEditor, {
businessObjectId: businessObjectId,
closable: true,
title: "test"
});
zhuUx.tabs.add(dataManagerPanel).show(); ///4:对页签进行隐藏,显示,移除,删除,激活等操作
zhuUx.tabs.getTabBar().items.getAt(i).show();
zhuUx.tabs.getTabBar().items.getAt(i).hide();
zhuUx.tabs.remove() ///6:隐藏页签表头
zhuUx.tabs.getTabBar().hide(); ///5:页签切换事件
mainTabChanged: function (tabPanel, newCard, oldCard, eOpts) {
var zhuUx = this;
if (newCard != zhuUx.luxianTab) {
/// 判断数据,是否需要刷新
try { } catch (e) { }
}
newCard.updateLayout();
}, ///6:常见页签的属性与方法

      closable ///是否可关闭
      iconCls ///图标样式
      iconAlign ///图标对齐方式
      disabled ///是否禁用


  

tabpanel如何隐藏页签表头以及基本用法总结的更多相关文章

  1. xshell显示隐藏窗口页签

    有时候不知道操作说了什么红框中的页签会消失,可以ctrl+shift+t 控制显示隐藏

  2. WPF如何实现一个漂亮的页签导航UI

    最近看到一个比较漂亮的UI主界面,该UI是用左边的页签进行导航,比较有特色,就想着尝试用WPF来实现一下.经过一番尝试,基本上将UI设计图的效果用WPF程序进行了实现.下面介绍一下主要的思路: 1 U ...

  3. android124 zhihuibeijing 新闻中心-新闻 -北京页签 下拉刷新

    缓存工具类:以url为key,json数据为value, package com.itheima.zhbj52.utils; import com.itheima.zhbj52.global.Glob ...

  4. android123 zhihuibeijing 新闻中心-新闻 页签 ViewPagerIndicator实现

    ## ViewPagerIndicator ## 使用导入ViewPagerIndicator库的方式相当于可以改源码,打包编译Eclips可以自动完成. ViewPager指针项目,在使用ViewP ...

  5. 使用原生js与jQuery分别实现一个简单的tab页签

    tab页签通常适用于空间有限而内容较多同时兼顾页面美观度不给用户一种信息过量视觉疲劳的情形.使用面非常广,下面我们用两种方法简单实现之. 首先,构建页面元素.页签的可点击部分我们通常用列表来承载,包括 ...

  6. [转] JQuery UI Tabs 动态添加页签,并跳转到新页签

    [From] https://blog.csdn.net/zhangfeng2124/article/details/76672403 需求: 1.tabs默认只有一个页签,但是需要点击某按钮,动态添 ...

  7. 1、CRM2011编程实战——清空指定页签以下的全部选项,并对页签以下的指定控件进行操作

    需求:当页面载入时,"呼叫编号"保持不变,"任务号"自己主动更新."接报时间"和"发生日期"自己主动设置为当天日期和时间 ...

  8. Android实现图片滚动控件,含页签功能,让你的应用像淘宝一样炫起来

    首先题外话,今天早上起床的时候,手滑一下把我的手机甩了出去,结果陪伴我两年半的摩托罗拉里程碑一代就这么安息了,于是我今天决定怒更一记,纪念我死去的爱机. 如果你是网购达人,你的手机上一定少不了淘宝客户 ...

  9. 实现Vue的多页签组件

    在之前的博客中  关于vue的多页面标签功能,对于嵌套router-view缓存的最终无奈解决方法  有写过vue的多页签功能的解决方案 可以看到我当时那个多页签的组件还是比较简单 的,只有打开跟关闭 ...

随机推荐

  1. Yii2 设计模式——Yii2 中用到哪些设计模式?

    Yii 2 设计模式“包含了两个方面的内容:1. 设计模式,2. Yii 2 框架. <设计模式>一书虽然以JAVA语言来表达设计模式的思想,但是设计模式远不限制于某一种特定的语言,而是在 ...

  2. nc--windows下工具分享

    1.在windows下安装了9个memcached. 一些测试需要经常对这9个memcached的执行flush_all的操作 由于windows没有linux那样可以使用nc命令. 经过不懈搜索,找 ...

  3. C# 每个字节接受 处理串口数据 的方法

      /// <summary> /// 向串口发送信息,有返回值 /// </summary> /// <param name="serialPort" ...

  4. 一键安装Davinci

    官网:https://edp963.github.io/davinci/index.html 下载地址:https://github.com/edp963/davinci   环境:Centos7   ...

  5. fatal error: No such file or directory

    在fase_ws中编译ground_car包,遇如下报错: /home/gordon/fase_ws/src/fsae/ground_car/plugins/gazebo_ros_block_lase ...

  6. php7带来的性能升级

    前言本文是一篇讲座听后+后续研究的总结. 话说当年追时髦,php7一出就给电脑立马装上了,php5和php7共存,也是立马写了个超级耗时间的循环脚本测了一番,确实php7给力很多,然后也是注意了一些新 ...

  7. 传统、VHD、VHDX性能对比测试(转帖)

    nkc3g4发表于 2014-4-30 16:24:41 传统.VHD.VHDX性能对比测试 - Windows To Go优盘系统 - 萝卜头IT论坛 - Powered by Discuz! ht ...

  8. oracle dg 报错提示 涉及硬盘错误

    ###oracle dg 报错提示 涉及硬盘错误 Dec 23 03:28:01 xhisdg rsyslogd: [origin software="rsyslogd" swVe ...

  9. LeetCode 791. Custom Sort String

    题目链接:https://leetcode.com/problems/custom-sort-string/description/ S and T are strings composed of l ...

  10. 解析-ESP01模块开发Arduino物联网wifi开关模块

    本文将解析<完美图解物联网Iot实操 ESP8266>中 第五章 P177页 动手做的代码2(使用SPIFFS文件系统的代码) 首先我们先动手使用Arduino IDE编译并且上传代码,上 ...