ExtJs4 desktop 開發 桌面圖標換行

以下是Ext4 的desktop桌面圖標換行問題網上流傳的解決方法 (是存在問題的)

init: function() {

this.callParent();

this.initShortcut();

}

注意 自定義函數 init 要放在 callParent 的下面。否則頁面初始化的時候。沒有換行。只有在變換頁面高度的時候,才換行。

initShortcut:function(){

        //shortcuts 自動換行

        var btnHeight = 70;//61

        var btnWidth = 64;

        var btnPadding = 35;//15

        var col = null;

        var row = null;

        function initColRow(){

            col = {

                index: 1, 

                x: btnPadding

            };

            row = {

                index: 1, 

                y: btnPadding

            };

        }

 

        initColRow();

 

        function isOverflow(y){

           //if(y > (Ext.lib.Dom.getViewHeight() - taskbarEl.getHeight())){

            if(y>Ext.get('ext-gen1003').getHeight()-Ext.get('taskbar-1024').getHeight()){

                return true;

            }

            return false;

        }

        this.setXY = function(item){

            var bottom = row.y + btnHeight,

            overflow = isOverflow(row.y + btnHeight);

            if(overflow && bottom > (btnHeight + btnPadding)){

                col = {

                    index: col.index++, 

                    x: col.x + btnWidth + btnPadding

                };

                row = {

                    index: 1,

                    y: btnPadding

                };

            }

            Ext.fly(item).setXY([

                col.x

                , row.y

                ]);

            row.index++;

            row.y = row.y + btnHeight + btnPadding;

        };

        this.handleUpdate = function(){

            initColRow();

            //var items=shortcuts.dom.children;

            var items = Ext.query(".ux-desktop-shortcut"); 

            for(var i = 0, len = items.length; i < len; i++){

                this.setXY(items[i]);

            }

        }

        this.handleUpdate();

        //每過 500 毫秒重繪頁面

        Ext.EventManager.onWindowResize(this.handleUpdate, this, {

            delay:500

        });

    //end shortcuts 自動換行

    }

    問題:

    依據此方法修改後,當瀏覽器窗口大小改變後桌面圖標纔會換行顯示,第一次進入應用程序後桌面圖標任然沒有換行顯示

  

    解決方法:

      在this.handleUpdate(); 後加

    Ext.Function.defer(this.handleUpdate, 500, this, []);


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章