1): 打開 EXT2.0/example/desktop 桌面，打開 sample.js 文件 .
getModules : function(){// 配置開始裏面：左邊的
return [
new MyDesktop.CmpWindow(),
new MyDesktop.ForumWindow(),
new MyDesktop.softWindow()
];
},
// config for the start menu 配置開始裏面，右邊的
getStartConfig : function(){
return {
title: ‘ddddddddddd ‘,
iconCls: ‘user’,
toolItems: [{
text:' 後臺管理 ',
iconCls:'settings',
scope:this
},'-',{
text:' 關於 ',
iconCls:'logout',
scope:this
}]
};
}
上面這兩個是配置開始欄裏面的左邊菜單和右邊菜單 . 簡單，而且很容易寫嘍 .
當 click 公司簡介的時候，調用 MyDesktop.CmpWindow() 動態產生一個窗品，具體如何實現，看代碼註解：
MyDesktop.CmpWindow = Ext.extend(Ext.app.Module, {
id:’esk-win’, // 窗口的唯一標識，這個非常重要
init : function(){
this.launcher = {
text: ‘ 企業 簡介 ‘, // 這個是標題
iconCls:’bogus’, // 這個是標題左邊的圖標
handler : this.createWindow, // 產生這個窗口的函數
scope: this
}
},
createWindow : function(){ // 產生 Window 函數
var desktop = this.app.getDesktop(); // 得到系統桌面對象
var win = desktop.getWindow(”esk-win”); // 取窗口
if(!win){ // 如果這個窗口對象沒有產生過
win = desktop.createWindow({
id: “esk-win”,
title:” 企業簡介 “,/ 標題
width:640,
height:480,
html :cmp_descr, // 內容
iconCls: ‘bogus’, // 圖標
shim:false,
animCollapse:false,
constrainHeader:true
});
}
win.show(); // 顯示窗口
}
});
開始欄是比較簡單，可桌面上圖標的 shortCuts 呢，它可是什麼都沒有寫呀 , 代碼如下：
<dl id=”x-shortcuts”>
<dt id=”esk-win-shortcut”>
<a href=”#”><img src=”images/cmp.png” />
<div> 企業簡介 </div></a>
</dt>
<dt id=”esk-news-shortcut”>
<a href=”#”><img src=”images/news.png” />
<div> 新聞資訊 </div></a>
</dt>
<dt id=”esk-product-shortcut”>
<a href=”#”><img src=”images/product.png” />
<div> 產品展示 </div></a>
</dt>
<dt id=”esk-soft-shortcut”>
<a href=”#”><img src=”images/show.png” />
<div> 在線演示 </div></a>
</dt>
<dt id=”esk-download-shortcut”>
<a href=”#”><img src=”images/down.png” />
<div> 下載中心 </div></a>
</dt>
<dt id=”esk-word-shortcut”>
<a href=”#”><img src=”images/word.png” />
<div> 客戶 留言 </div></a>
</dt>
<dt id=”esk-forum-shortcut”>
<a href=”#”><img src=”images/word.png” />
<div>ESK 分銷論壇 </div></a>
</dt>
</dl>
</div>
最後它是怎麼找到對應的 createWindow 呢，還是把代碼糾出來，一看就明白了。打開 desktop.js 文件
var shortcuts = Ext.get(’x-shortcuts’);// 取到快捷鍵區
if(shortcuts){ // 如果存在
shortcuts.on(’click’, function(e, t){
// 爲這個區加一個 click 函數，只要有 click 事件發生，就會掉用此處，
if(t = e.getTarget(’dt’, shortcuts)){// 當 click 的時候
e.stopEvent();// 停此事件
// 取到上面的 MyDesktop.CmpWindow, 注意， html 當中定義的 id 去掉 -shortcut 後就是上面 window 的 id, 這個與上面對應，所以能取到 )
var module = app.getModule(t.id.replace(’-shortcut’, ”))
if(module){// 如果沒有產生過
module.createWindow();// 顯示窗口
}
}
});
}