Extjs5 TreePanel 和TabPanel皮肤。

最近搞Extjs5基础平台,需要一套统一风格,自己做了一个TreePanel 和TabPanel皮肤。分享给大家,先看效果如下:

1:颜色可自行搭配,只需要大体只需要修改css即可,left.css是TreePanel的,main.css是TabPanel。

2:使用baseUx.tree.NTreePanel时,需要设置bodyStyle : ‘background-color:#21232b‘。

3:使用baseUx.tree.NTreePanel时,注意引入文件顺序:NTreeColumn.js、NViewTable.js、NTreeView.js、NTreePanel.js,另外记得引入:left.css

4:使用TabPanel只需要引入main.css即可。

相关内容在附件。

时间: 2024-10-19 07:39:04

Extjs5 TreePanel 和TabPanel皮肤。的相关文章

ExtJs treepanel和TabPanel配合使用

tree.js Ext.onReady(function() { Ext.lib.Ajax.defaultPostHeader += '; charset=utf-8'; var center = new Ext.TabPanel( { id : 'tab_main', region : 'center', frame : false, items : [ { id : 'welcome', title : '首页', html : "<iframe src='welcome.jsp' w

构建施耐德楼控系统数据库后台服务器示例工程三(Web端展示)

最近看到Extjs的示例中有仿操作系统桌面的代码,并且展示效果很美观,结合楼控这个系统的Web端展示需求,目前前端采用Extjs.楼控相关的操作会设计成桌面中的不同应用. Extjs初次入手看起来很复杂,但是由于其自带的示例代码很丰富,通常在了解一些基本概念后,参照着示例代码一步一步去做,我认为是最好的学习方式了. 目前我参照着Extjs中仿照桌面的示例代码,做出了如下的画面: 从图中我们可以看出,我目前在仿照着这个示例代码中的GridPanel.TabPanel.Window这些基本的组件,做

跟我一起学extjs5(13--执行菜单命令在tabPanel中显示模块)

跟我一起学extjs5(13--执行菜单命令在tabPanel中显示模块) 上面设计好了一个模块的主界面,下面通过菜单命令的执行来把这个模块加入到主界面当中.在MainModule.js中有一个函数,生成了当前的菜单数据: // 根据data.systemMenu生成菜单条和菜单按钮下面使用的菜单数据 getMenus : function() { var items = []; var menuData = this.get('systemMenu'); // 取得定义好的菜单数据 Ext.A

[ExtJS5学习笔记]第二十九节 sencha ext js 5.1.0中动态更换皮肤主题

本文地址:http://blog.csdn.net/sushengmiyan/article/details/42016107 本文作者:sushengmiyan ------------------------------------------------------------------------------------------------------------------------------------ 为方便起见,使用sencha cmd创建一个工程,使用app buil

Extjs5 tree扩展----treepanel树组件

Ext.define('MyExtend.lib.TreeFilter', { filterByText: function(text) { this.filterBy(text, 'text' ); }, /** * 根据字符串过滤所有的节点,将不符合条件的节点进行隐藏. * @param 查询字符串. * @param 要查询的列. */ filterBy: function(text, by) { this.clearFilter(); var view = this .getView()

12、手把手教你Extjs5(十二)执行菜单命令在tabPanel中显示模块

上面设计好了一个模块的主界面,下面通过菜单命令的执行来把这个模块加入到主界面当中.在MainModule.js中有一个函数,生成了当前的菜单数据: // 根据data.systemMenu生成菜单条和菜单按钮下面使用的菜单数据 getMenus : function() { var items = []; var menuData = this.get('systemMenu'); // 取得定义好的菜单数据 Ext.Array.each(menuData, function(group) {

[ExtJS5学习笔记]sencha ext js 5.1.0中动态更换皮肤主题

本文地址:http://blog.csdn.net/sushengmiyan/article/details/42016107 本文作者:sushengmiyan ------------------------------------------------------------------------------------------------------------------------------------ 为方便起见,使用sencha cmd创建一个工程,使用app buil

小梅科普:Extjs5.0从入门到实战开发信息管理系统

Extjs基础.Extjs5新特性.Spring.Spring mvc.Mybatis系列课程 Extjs作为一款优秀的JS前端开发框架以其良好的架构.丰富的UI组件库.完善的文档和社区支持等诸多优点拥有广泛的市场应用空间,开发人员无需过多的关注HTML.CSS甚至各种常用JS算法,只需把精力放在业务逻辑上,利用各种组件的相互组合调用便可轻松而高效的开发出系统的前端页面. Extjs5在之前版本的基础上又推出了一系列实用而强大的功能,诸如:MVVM架构,路由器,双向数据绑定,平板支持,使Extj

Extjs5.0从入门到实战开发信息管理系统(Extjs基础、Extjs5新特性、Spring、Spring mvc、Mybatis)视频教程

Extjs5.0从入门到实战开发信息管理系统(Extjs基础.Extjs5新特性.Spring.Spring mvc.Mybatis)视频教程下载   联系QQ:1026270010 Extjs作为一款优秀的JS前端开发框架以其良好的架构.丰富的UI组件库.完善的文档和社区支持等诸多优点拥有广泛的市场应用空间,开发人员无需过多的关注HTML.CSS甚至各种常用JS算法,只需把精力放在业务逻辑上,利用各种组件的相互组合调用便可轻松而高效的开发出系统的前端页面. Extjs5在之前版本的基础上又推出