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公司簡介的時候,調(diào)用MyDesktop.CmpWindow()動態(tài)產(chǎn)生一個窗品,具體如何實現(xiàn),看代碼注解:
MyDesktop.CmpWindow = Ext.extend(Ext.app.Module, {
id:’esk-win’, //窗口的唯一標識,這個非常重要
init : function(){
this.launcher = {
text: ‘企業(yè)簡介‘, //這個是標題
iconCls:’bogus’, //這個是標題左邊的圖標
handler : this.createWindow, //產(chǎn)生這個窗口的函數(shù)
scope: this
}
},
createWindow : function(){ //產(chǎn)生Window函數(shù)
var desktop = this.app.getDesktop(); //得到系統(tǒng)桌面對象
var win = desktop.getWindow(”esk-win”); //取窗口
if(!win){ //如果這個窗口對象沒有產(chǎn)生過
win = desktop.createWindow({
id: “esk-win”,
title:”企業(yè)簡介“,/標題
width:640,
height:480,
html :cmp_descr, //內(nèi)容
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>企業(yè)簡介</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>產(chǎn)品展示</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’);//取到快捷鍵區(qū)
if(shortcuts){ //如果存在
shortcuts.on(’click’, function(e, t){
//為這個區(qū)加一個click函數(shù),只要有click事件發(fā)生,就會掉用此處,
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){//如果沒有產(chǎn)生過
module.createWindow();//顯示窗口
}
}
});
}