常规功能和模块自定义系统 (cfcmms)—052在extjs中自定义theme
来源:互联网 发布:中国没有未来知乎 编辑:程序博客网 时间:2024/06/03 22:56
052在extjs中自定义theme
在extjs中的皮肤theme有好几种了,都是官方提供的。在extjs6中又新增了一个triton的theme,这个theme是扁平化的,看着效果还不错,但是其占用的空间太大了,不符合一些对空间有特殊需求的界面。在看了官网的对theme进行扩展的文章后,自己动手将triton的这个theme进行改造,使其更加紧凑。先来看一下改过后的效果图。
根据官网上的说明,现在开始改造过程。
1、使用sencha cmd 生成一个新的theme。(先要进入你的工程目录,也就是原来用sencha cmd生成的项目的目录之下。)
执行命令: sencha generate theme triton-small,执行好以后会在工程文件的packages/local下生成triton-small这个目录。
先修改package.json , 找到 “extend”选项,改成 "extend":"theme-triton"。
2、在上面的triton-small下面还有少的目录。我们主要关心的是sass这个目录下面。
3、然后的事就简单了,比如说对于button而言,
对于grid来说,行高过大也是一个问题,把他的padding改小,变得矮一些。
把你看不顺眼的控件一个个这样修改,主要是 padding 的修改。改好过后即可。
4、使用新的theme。
在app.json 中将 "theme"选项设置成 "theme": "triton-small",再用sencha cmd 编译一下即可看见效果了。
2 0
- 常规功能和模块自定义系统 (cfcmms)—052在extjs中自定义theme
- 常规功能和模块自定义系统 (cfcmms)—007Extjs的配置文件和自定义ui
- 常规功能和模块自定义系统 (cfcmms)—013给Extjs6加入多界面主题(Theme)
- 常规功能和模块自定义系统(cfcmms)—006Extjs的目录结构和mvvm介绍
- 常规功能和模块自定义系统(cfcmms)—001序言
- 常规功能和模块自定义系统(cfcmms)—002目录
- 常规功能和模块自定义系统(cfcmms)—003概述
- 常规功能和模块自定义系统 (cfcmms)—014模块自定义概述(1)
- 常规功能和模块自定义系统 (cfcmms)—015模块自定义概述(2权限)
- 常规功能和模块自定义系统 (cfcmms)—057 最新版的自定义系统演示
- 常规功能和模块自定义系统 (cfcmms)—043模块导航功能的重构(1)
- 常规功能和模块自定义系统 (cfcmms)—044模块导航功能的重构(2)
- 常规功能和模块自定义系统(cfcmms)—004可自定义的项目
- 常规功能和模块自定义系统 (cfcmms)—017自定义grid方案(1)
- 常规功能和模块自定义系统 (cfcmms)—018自定义grid方案(2)
- 常规功能和模块自定义系统 (cfcmms)—019自定义grid方案(3)
- 常规功能和模块自定义系统 (cfcmms)—021自定义grid列(5附件列)
- 常规功能和模块自定义系统 (cfcmms)—022自定义grid列(6图标列)
- Linux GCC 开发入门(2) -- 日志输出功能 从windows移植 NCTRACE
- swiper的基础使用(十六)
- 基于ListView的源码分析工作原理
- C#正则表达式的零宽断言
- servlet学习(二)
- 常规功能和模块自定义系统 (cfcmms)—052在extjs中自定义theme
- Android 自定义SeekBar附带源码和素材。。。。。
- Android开发之viewpager导报错误解决方法:错误代码 Caused by: java.lang.ClassNotFoundException: Didn't find class
- DTP取上月
- ACM简单题剖析
- web开发中web对象影响范围和生命周期
- 原生JS的事件绑定
- c#打包安装程序[VS2010]
- 认识Composer