ExtJS Layout, horizontally grow vertically

I have an Ext.panel.Panel in which I want to dynamically add other "smaller" panels representing different "things" in my application. This panel is at the top of the grid and has the same width as the grid. When the "smaller" panel is dynamically added to this "container panel", I want the panels to be added horizontally and then vertically if the total width of all the "small" panels is greater than the width of the container.

I tried 'fit', 'hbox', 'vbox', that's all.

Am I missing a layout type?

+5
source share
2 answers

, , flow, ExtJS ( , , , , dataview, css, ).

columnWidth. :

 Ext.create('Ext.Panel', {
        width: 500,
        height: 280,
        title: "ColumnLayout Panel",
        layout: 'column',
        renderTo: document.body,
        items: [{
            xtype: 'panel',
            title: 'First Inner Panel',
            width:  250,
            height: 90
        },{
            xtype: 'panel',
            title: 'Second Inner Panel',
            width: 200,
            height: 90
        }, {
            xtype: 'panel',
            title: 'Third Inner Panel',
            width: 150,
            height: 90
        }]
  });

enter image description here

+4

, ExtJS 4.2.2 .

:

style: {
    float: 'left'
},

, .

(, ), add/remove ( ). - . - .

+5

All Articles