Extjs 下的换肤功能实现。

来源：互联网发布：局域网禁止p2p软件编辑：程序博客网时间：2024/04/25 21:02

1、在html页面（每一个例子）的body中间加上以下代码（换肤工具条）

<div id="lib-bar" class="x-toolbar" style="border-width:0 1px 1px; text-align:right; width:150px; position:absolute; right:0px;left:auto; top:2px; "><div id="lib-bar-inner">
<span>Theme:</span>
<select id="exttheme">
<option value="default">Ext Blue</option>
<option value="gray">Gray Theme</option>
<option value="black">Black Theme</option>
<option value="green">Green Theme</option>
<option value="calista">Calista Theme</option>
<option value="darkgray">Darkgray Theme</option>
<option value="indigo">Indigo Theme</option>
<option value="midnight">Midnight Theme</option>
<option value="olive">Olive Theme</option>
<option value="pink">Pink Theme</option>
<option value="purple">Purple Theme</option>
<option value="slate">Slate Theme</option>
<option value="slickness">Slickness Theme</option>
</select></div></div>

2、更改 ./examples/examples.js 文件中的 40行
将
Ext.getBody().addClass('x-'+theme);
改为
Ext.util.CSS.swapStyleSheet("theme", "../../resources/css/xtheme-" + theme + ".css");

完成这两步后就大功告成了！