Панель вкладок EXTJS расширяет вкладки, чтобы заполнить панель

Question

У меня проблема в том, что я не могу получить свои вкладки на панели вкладок extjs, чтобы заполнить всю ширину панели. Я пытался вызвать resizeTabs, но не нашел ответа на этот проблем, спасибо заранее.

Answer 1

В вашей конфигурации панели вкладок добавьте следующую конфигурацию tabBar:

        tabBar: {
            defaults: {
                flex: 1
            },
            dock: 'top',
            layout: {
                pack: 'center'
            }
        }

Answer 2

Добавьте «layout: fit» к конфигурации ваших отдельных панелей.

var tabs = new Ext.TabPanel({
    items: [{
        title: 'Tab 1',
        html: 'A simple tab',
        layout: 'fit'
    },{
        title: 'Tab 2',
        html: 'Another one',
        layout: 'fit'
    }]
});

Или для подхода DRYer, используйте опцию конфигурации TabPanel «defaults», если вы хотите, чтобы все панели имели«подходящая» раскладка:

var tabs = new Ext.TabPanel({
    defaults: {
        layout: 'fit'
    },
    items: [{
        title: 'Tab 1',
        html: 'A simple tab'
    },{
        title: 'Tab 2',
        html: 'Another one'
    }]
});