Extjs, как установить 100% высоты для панели vbox - PullRequest
7 голосов
/ 07 января 2012

enter image description here

Привет ~,

Я хочу установить 100% высоты над панелью 2. но я не знаю, как это сделать ..

вот мой тестовый код,

{
    title : 'EAST',
    region : 'east',
    layout : 'vbox',
    layoutConfig : {
        align : 'stretch'
    },
    bodyStyle : 'border:1px solid blue',
    width: 300,
    items : [
        new Ext.Panel({
            title : 'Panel 1',
            border : true,
            layout : 'fit',
            height : 250,
            html : 'PANEL 1 AREA'
        }),
        new Ext.Panel({
            title : 'Panel 2',
            border : true,
            bodyStyle : 'border:1px solid red',
            layout : 'fit',
            html : 'PANEL 2 AREA'
        })
    ]
}

Я пробовал, autoHeight: true и height: '100%' для панели 2, но это не работает.

Кто-нибудь знает, пожалуйста, помогите мне ~

спасибо ~!

Ответы [ 2 ]

13 голосов
/ 07 января 2012

Для второй панели следует использовать свойство flex.

new Ext.Panel({
    title : 'Panel 2',
    border : true,
    bodyStyle : 'border:1px solid red',
    layout : 'fit',
    html : 'PANEL 2 AREA',
    flex: 1
})
4 голосов
/ 07 января 2012

попробуйте установить свойство flex на второй панели.

    new Ext.Panel({
        title     : 'Panel 2',
        border    : true,
        bodyStyle : 'border:1px solid red',
        layout   : 'fit',
        html      : 'PANEL 2 AREA',
        flex      : 1

    })

flex используется только в том случае, если Компонент визуализируется Контейнером, который был настроен для использования BoxLayout.Каждый дочерний компонент со свойством flex будет сгибаться либо вертикально (с помощью VBoxLayout), либо горизонтально (с помощью HBoxLayout) в соответствии с относительным значением сгибания элемента по сравнению с суммой всех компонентов с указанным значением flex.

...