ExtJS 4 : desktop shortcut location

阅读更多

  ExtJS 4 Desktop 例子中的桌面图标始终在第一列显示，不论有多少个。重写Desktop的部分方法，让其自动适应位置。

  Ext.override(Ext.ux.desktop.Desktop, {
      createDataView: function () {
        var me = this;
        return {
          xtype: 'dataview',
          overItemCls: 'x-view-over',
          trackOver: true,
          itemSelector: me.shortcutItemSelector,
          store: me.shortcuts,
          tpl: new Ext.XTemplate(me.shortcutTpl),
          listeners: {
            'refresh': me.positionItems,
            'resize': me.positionItems
          }
        };
      },

      positionItems: function() {
        var me = this,
            height = this.getHeight(),
            x = 0,
            y = 0;

        // get  the max width and height of shortcuts
        if (!me.itemWidth && !me.itemHeight) {
          me.itemHeight = 0;
          var h = 0, rh;

          this.all.each(function(item) {
            var el = Ext.get(item),
                box = el.getBox();
            me.itemWidth = me.itemWidth || box.right;
            me.itemHeight = (rh = box.bottom - h) > me.itemHeight ? rh : me.itemHeight;
            h = box.bottom;
          });
        }

        this.all.each(function(item) {
          var el = Ext.get(item);
          if ((y+me.itemHeight) > height) {
            x += me.itemWidth;
            y = 0;
          }
          el.setXY([x, y]);
          y += me.itemHeight;
        });
      }
    });