Border layout: Dynamic splitter

[andaction]

Hi,

I defined a panel with a border layout and three child containers. In my application these child containers are "frames" which can host different (or none) components, depending on the application state. In case a frame contains a child component I there should be a splitter. If a frame contains no child component, the splitter should be invisible. Is it possible to dynamically show/hide the splitter of a frame after it has been inserted into the panel with the border layout?

 
{
            xtype:'container',
            region:'center',
            layout:'border',
            items: [
                {
                    id: 'frame1',
                    xtype: 'container',
                    region: 'north',
                    layout: 'fit'
                },
                {
                    id: 'frame2',
                    xtype: 'panel',
                    layout: 'fit',
                    region: 'west',
                    split: 'true'
                },
...
}

thanx

[scottmartin]

This should work:

var panel = 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
        itemId: 'south-panel',
        margins: '0 5 5 5'
    },{
        // xtype: 'panel' implied by default
        title: 'West Region is collapsible',
        region:'west',
        xtype: 'panel',
        margins: '5 0 0 5',
        width: 200,
        collapsible: true,   // make collapsible
        id: 'west-region-container',
        layout: 'fit'
    },{
        title: 'Center Region',
        region: 'center',     // center region is required, no width/height specified
        xtype: 'panel',
        layout: 'fit',
        margins: '5 5 0 0'
    }],
    renderTo: Ext.getBody()
});

var sp = panel.down('#south-panel');
sp.splitter.el.hide();

Regards,
Scott.