Высота баяна и прокрутка в ExtJS

Question

У меня есть макет «карточка», и один из предметов - это макет типа «гармошка» с большим количеством предметов. Проблема в том, что содержимое некоторых элементов невозможно увидеть, потому что над аккордеоном расположены заголовки.

Настройка autoScroll:true не работает, потому что, по-видимому, высота макета определяется суммой высот заголовков (а не текущих высот элементов).

var accordion= {

    id:'items-info',
    title: 'Items Info',
    layout:'accordion',
    bodyBorder: false,  
    bodyStyle: 'background-color:#DFE8F6;display:block;',  
    autoScroll:true,
    items: [{
        title: 'Title',
        html: '<p>Item</p><p>This content just get lost</p>'
    },{
        title: 'Title',
        html: '<p>Item</p><p>This content just get lost</p>'
    },{
        title: 'Title',
        html: '<p>Item</p><p>This content just get lost</p>'
    },{
        title: 'Title',
        html: '<p>Item</p><p>This content just get lost</p>'
    },{
        title: 'Title',
        html: '<p>Item</p><p>This content just get lost</p>'
    },{
        title: 'Title',
        html: '<p>Item</p><p>This content just get lost</p>'
    },{
        title: 'Title',
        html: '<p>Item</p><p>This content just get lost</p>'
    },{
        title: 'Title',
        html: '<p>Item</p><p>This content just get lost</p>'
    },{
        title: 'Title',
        html: '<p>Item</p><p>This content just get lost</p>'
    },{
        title: 'Title',
        html: '<p>Item</p><p>This content just get lost</p>'
    }]

};

Answer 1

Это должно работать нормально, если вы дадите панелям элементов макет fit:

{
    title: 'Title',
    layout: 'fit',
    html: '<p>Item</p><p>This content just get lost</p>'
}

Если нет, ваша конфигурация bodyStyle может переопределять какое-то свойство стиля, которое решает проблему.

Answer 2

Как насчет этого:

Ext.create('Ext.panel.Panel', {
        width: '100%',
        height: 200,
        layout:'accordion',
        defaults: {
            autoScroll:true
        },
        ...
});

Answer 3

Как насчет использования activeOnTop: true?