I had some issues with the vBox layout that’s shipped with Ext JS 3.2.1 and I believe this applies to previous versions as well. Basically I had a vBox layout with two grid panels in it. When I collapsed one of the panels the other panel would not automatically resize to fill the blank space. So I added an event listener on expand/collapse of the panel (see below), however this did not entirely resolve the problem. What happened now was the other panel would resize but would fill the entire layout and I would lose the collapsed panel.

    expand: function (panel) {
        panel.ownerCt.doLayout(true);
    },
    collapse: function (panel) {
        panel.ownerCt.doLayout(true);
    }

The fix is documented in the following Ext forum post. Like APEX, Ext has a great support community which is a great help, especially as it’s a little harder to work out than APEX. I recommend you use it if you’re not already.

Here’s a preview of how it looks (with the required fix) when you expand/collapse the top and bottom regions of a vBox layout

« Previous Next »

1 2