1):打開(kāi)EXT2.0/example/desktop桌面，打開(kāi)sample.js文件.

      getModules : function(){//配置開(kāi)始里面：左邊的

             return [

                    new MyDesktop.CmpWindow(),

                    new MyDesktop.ForumWindow(),

                    new MyDesktop.softWindow()

             ];

      },

   // config for the start menu  配置開(kāi)始里面，右邊的

   getStartConfig : function(){

       return {

           title: ‘ddddddddddd‘,

           iconCls: ‘user’,

           toolItems: [{

               text:'后臺(tái)管理',

               iconCls:'settings',

               scope:this

           },'-',{

               text:'關(guān)于',

               iconCls:'logout',

               scope:this

           }]

       };

}

上面這兩個(gè)是配置開(kāi)始欄里面的左邊菜單和右邊菜單.簡(jiǎn)單，而且很容易寫(xiě)嘍.

當(dāng)click公司簡(jiǎn)介的時(shí)候，調(diào)用MyDesktop.CmpWindow()動(dòng)態(tài)產(chǎn)生一個(gè)窗品，具體如何實(shí)現(xiàn)，看代碼注解：

MyDesktop.CmpWindow = Ext.extend(Ext.app.Module, {

      id:’esk-win’, //窗口的唯一標(biāo)識(shí)，這個(gè)非常重要

   init : function(){

       this.launcher = {

           text: ‘企業(yè)簡(jiǎn)介‘, //這個(gè)是標(biāo)題

           iconCls:’bogus’,   //這個(gè)是標(biāo)題左邊的圖標(biāo)

           handler : this.createWindow, //產(chǎn)生這個(gè)窗口的函數(shù)

           scope: this

       }

   },

   createWindow : function(){ //產(chǎn)生Window函數(shù)

       var desktop = this.app.getDesktop(); //得到系統(tǒng)桌面對(duì)象

       var win = desktop.getWindow(”esk-win”); //取窗口

       if(!win){                           //如果這個(gè)窗口對(duì)象沒(méi)有產(chǎn)生過(guò)

           win = desktop.createWindow({

               id: “esk-win”,          

               title:”企業(yè)簡(jiǎn)介“,/標(biāo)題

               width:640,

               height:480,

               html :cmp_descr,  //內(nèi)容

               iconCls: ‘bogus’,  //圖標(biāo)

               shim:false,

               animCollapse:false,

               constrainHeader:true

           });

       }

       win.show();  //顯示窗口

   }

});

 開(kāi)始欄是比較簡(jiǎn)單，可桌面上圖標(biāo)的shortCuts呢，它可是什么都沒(méi)有寫(xiě)呀,代碼如下：

   <dl id=”x-shortcuts”>

       <dt id=”esk-win-shortcut”>

           <a href=”#”><img src=”images/cmp.png” />

           <div>企業(yè)簡(jiǎn)介</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>

最后它是怎么找到對(duì)應(yīng)的createWindow呢，還是把代碼糾出來(lái)，一看就明白了。打開(kāi)desktop.js文件

   var shortcuts = Ext.get(’x-shortcuts’);//取到快捷鍵區(qū)

   if(shortcuts){                  //如果存在

       shortcuts.on(’click’, function(e, t){

//為這個(gè)區(qū)加一個(gè)click函數(shù)，只要有click事件發(fā)生，就會(huì)掉用此處，

           if(t = e.getTarget(’dt’, shortcuts)){//當(dāng)click的時(shí)候

               e.stopEvent();//停此事件

//取到上面的MyDesktop.CmpWindow,注意，html當(dāng)中定義的id去掉-shortcut后就是上面window的id,這個(gè)與上面對(duì)應(yīng)，所以能取到)

               var module = app.getModule(t.id.replace(’-shortcut’, ”))

               if(module){//如果沒(méi)有產(chǎn)生過(guò)

                   module.createWindow();//顯示窗口

               }

           }

       });

   }