ExtJS 4中,accordion布局的Panel下,TreePanel高度自动适应

11 9月

在accordion布局的Panel下,每个item放一个Treepanel应该是很常见的做法,但是在实际项目中发现,TreePanel的高度总是没办法恰好适应,要不就是Treepanel是完整高度的,超出了Panel的高度,下面的内容就无法显示出来了,如果是固定的高度,那么底部又有很多空白,通过监听Panel的resize事件可以很方便的解决这个问题。

在Panel下添加一个resize的监听器,代码如下:

listeners: {
        resize: function ( athis, adjWidth, adjHeight, eOpts ) {
            // adjHeight为Panel的高度
            if (adjHeight > 0) {
                // 获取Panel下所有的treepanel
                var components = athis.query('treepanel');
                for (var i in components) {
                    // 我这里是有3个treepanel,所以是105,根据实际情况设置为35 * N就好
                    components[i].setHeight(adjHeight - 105);
                }
            }
        }
    }

 

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注