Ext.theme.addManifest(
{
xtype: 'panel',
ui: 'highlight'
}
);
编辑"packages/my-custom-theme/sass/example/theme.html"添加以下脚本标签：
复制代码 代码如下:
<!-- Required because Sencha Cmd doesn't currently add manifest.js from parent themes -->
<script src=""></script>
<!-- Your theme's manifest.js file -->
<script src="https://www.jb51.net/manifest.js"></script>
为了能够在构建应用程序时将UI切片，必须在"theme-demo-app/sass/example/theme.html"中添加两个脚本标记：
复制代码 代码如下:
<script type="text/javascript" src=""></script>
<script type="text/javascript" src=""></script>
构建应用程序，在IE8及以下版本浏览，可以看到 "highlight" panel 展示的是圆角，和在IE9及其他浏览器的CSS3效果呈现一致。
（IE7中）
2.3.12覆盖主题JS
有时一个主题可以通过配置JS改变组件外观。通过覆盖主题包中的JavaScript就可以实现。如，创建"packages/my-custom-theme/overrides/panel/Panel.js" ，代码如下：
复制代码 代码如下:
Ext.define('MyCustomTheme.panel.Panel', {
override: 'Ext.panel.Panel',
titleAlign: 'center'
});
现在需要构建主题包来让"packages/my-custom-theme/build/my-custom-theme.js"包含这个新的覆盖文件。在"packages/my-custom-theme/" 下运行：
sencha package build
现在应该刷新应用程序,这样在开发模式下运行应用程序会包括该主题的JS覆盖文件。在 "theme-demo-app"下运行：
sencha app refresh
构建应用：
sencha app build
在浏览器中打开"theme-demo-app/index.html"，你将看到如下
您可能感兴趣的文章: