每一个ExtJS程序都是从一个Application类的实例开始的。它包含了你程序的全局设置。
自定义主题的例子：新建一个工作空间：windows控制台窗口下进入有sdk所在的目录输入命令：sencha –sdk ~/ generateworkspace my-workspace，而后会发现在sdk所在的目录下会出现myworkspace文件夹。其中有连个目录分别为：ext,packages
在myworkspace目录下输入命令：sencha –sdk ext generate app ThemeDemoApp theme-demo-app
在myworkspace目录下的theme-demo-app目录下输入命令：senchagenerate theme my-custom-theme将会在myworkspace\packages\my-custom-theme目录下有很多的文件，说明创建自定义主题包成功！
（1）在packages/my-custom-theme/package.json中将"extend": "ext-theme-classic"修改为："extend": "ext-theme-neptune"。
（2）在my-custom-theme/sass/var/目录下创建一个叫Component的scss文件并输入内容：$base-color: #317040 !default;
（3）在packages/my-custom-theme/sass/var/panel/添加Panel.scss文件并输入内容：$panel-header-font-family:Times New Roman !default;
（4）在"packages/my-custom-theme/resources/images/shared/icon-info.png"添加图片文件icon-info.png为，到时候就能使信息对话框为一个自定义的微笑图像。这需要在theme-demo-app/app/view/Main.js中添加如下代码：
items: [{ xtype: ‘button‘, text: ‘Show Message‘, handler: function() { Ext.Msg.show({ title: ‘Info‘, msg: ‘Message Box with custom icon‘, buttons: Ext.MessageBox.OK, icon: Ext.MessageBox.INFO }); } }] |
在windows控制台下转到theme-demo-app目录，输入sencha appwatch命令。在浏览器中输入：http://localhost:1841将看到如下效果。
本文出自 “Extjs自定义主题” 博客，请务必保留此出处http://9865563.blog.51cto.com/9855563/1679748
原文：http://9865563.blog.51cto.com/9855563/1679748