Question

Let’s suppose that we have the following code:

Ext.create ( 'Ext.container.Viewport', {
    layout : 'border',
    items  : [{
        region : 'west',
        xtype  : 'panel',
        collapsible : true,
        id     : 'panel1_id',
        width  : '45%'
    }, {
        region    : 'center',
        xtype     : 'panel',
        id        : 'panel2_id',
        width     : '55%'
    }]
});

As we can see, the first panel is collapsible. My question is:
is it possible to disable the panel’s preview (when we click on the collapsed panel’s header) when collapsed?

Answer 1

No, it is not collapased. You need to set collapsed: true for that.

Ext.create ( 'Ext.container.Viewport', {
        layout : 'border',
        items  : [{
                    region : 'west',
                    xtype  : 'panel',
                    collapsible : true, // this show the tool within the header
                    collapsed: true, // this collapses 
                    floatable: false, // prevent floating on header-click when collapsed
                    id     : 'panel1_id',
                    width  : '45%'
                  },{
                    region    : 'center',
                    xtype     : 'panel',
                    id        : 'panel2_id',
                    width     : '55%'
                  }]
});