ExtJS:east/west 区域占用可用 space 当其他区域不存在时

ExtJS: east/west region to occupy available space when other regions are not present

我正在为我的 application.I 使用边框布局,希望在其他区域隐藏或不存在时让 east/west 区域占据可用的 space。 例如,如果有东部和中心区域,如果中心区域被隐藏,东部区域将自动占据 space 可用空间。 请提出您的想法以实现这一目标。 谢谢。

我建议巧妙地使用 flex 属性。

这是给你的Sencha Fiddle

Ext.create('Ext.panel.Panel', {
width: 500,
height: 300,
title: 'Border Layout',
layout: 'border',
items: [{
    title: 'South Region is resizable',
    region: 'south', // position for region
    xtype: 'panel',

    height: 100,
    split: true, // enable resizing
    margins: '0 5 5 5'
}, {
    // xtype: 'panel' implied by default
    title: 'West Region is collapsible',
    region: 'west',
    xtype: 'panel',
    layout: 'fit',
    flex:100,
    collapsible:true,
    id: 'west-region-container',
    layout: 'fit',
    html:'Content of the west panel'
}, {
    title: 'Center Region is collapsible',
    region: 'center', 
    xtype: 'panel',
    flex:100,
    layout: 'fit',
    collapsible:true,
    html:'Content of the center'
}],
renderTo: Ext.getBody()
});