ExtJS - Desktop - 開發豆瓣FM應用

     這次爲了美化圖標，山寨了點WebQQ的圖標，純屬好看，題外話：火狐的Firbug是好東西，山寨全靠它了。

    下面是ExtJS版的豆瓣FM ：

    

    代碼很簡單，實現原理就是在豆瓣FM的地址上套一個Ext.Wndow的殼。

   

Ext.define('MyDesktop.Douban', {
    extend: 'Ext.ux.desktop.Module',

    id:'douban',
    windowId: 'douban-window',

    tipWidth: 160,
    tipHeight: 96,

    init : function(){
        this.launcher = {
            text: '豆瓣FM',
            iconCls:'douban-small-shortcut',
            handler : this.createWindow,
            scope: this
        }
    },

    createWindow : function(){
        var me = this, desktop = me.app.getDesktop(),
            win = desktop.getWindow(me.windowId);

        if (!win) {
            win = desktop.createWindow({
                id: me.windowId,
                title: '豆瓣FM',
                width: 430,
                height: 221,
                iconCls: 'douban-small-shortcut',
                animCollapse: false,
                border: false,
                maximizable : false,
                resizable : false,
                layout: 'fit',
                items: [
                    {
                    	xtype : 'panel',
                    	html : '<iframe id="douoban_iframe" scrolling="auto" ' + 
                    		'frameborder="no" hidefocus="" allowtransparency="true" ' + 
                    		'src="http://douban.fm/partner/webqq" name="%7B%22appid%22%3A3402%2C%22webqqkey%22%3A0.002194722502731783%2C%22webqqdomain%22%3A%22web.qq.com%22%7D"' +  
                    		//主要是這個豆瓣FM的鏈接
                    		'style="width: 100%; height: 100%;">'
                    }
                ]
            });
        }

        win.show();

        return win;
    },

});

  至於上面的桌面是怎麼回事，看ExtJS的桌面例子，就是對其進行優化而來！