Изменение высоты или добавление отступов к компоненту EXTjs ext.tab.Tab

У меня есть панель вкладок с несколькими вкладками внутри. Я использую свойство iconCls на вкладках, чтобы дать каждой вкладке изображение вместе с его заголовком. Я использую значки fam fam fam 16x16 и по умолчанию пространство табуляции обрезает изображения сверху/снизу.

Я попытался возиться с классом значка, изменив поля, но это не помогает. Согласно документации, компонент ext.tab.Tab имеет свойства заполнения и высоты, но их установка не влияет на вкладку во время выполнения.

Ext.define('AM.view.Tab.Standard', {
    extend: 'Ext.tab.Panel',
    alias: 'widget.TabStandard',

    region: 'center', // a center region is ALWAYS required for border layout
    deferredRender: false,
    activeTab: 0,     // first tab initially active

    initComponent: function() {
      this.items = this.buildItems();  

      this.callParent(arguments);    
    },

    buildItems: function(){
      var items = 
            [
                {
                    padding: 10, // nope :(
                    title: 'Gantt',
                    autoScroll: true,
                    iconCls: 'gantt icon',
                }, 
                {
                    height: 10, // nope :(
                    title: 'Logs',
                    autoScroll: true,
                    iconCls: 'logs icon',
                },
                {
                    title: 'Help',
                    autoScroll: true,
                    iconCls: 'help icon',
                }
            ];
        return items
    },
});

Возможно, я неправильно понимаю, как работают эти свойства, но все на странице выглядит одинаково.

РЕДАКТИРОВАТЬ: Похоже, у меня такая же проблема с «Заголовками» (полоса с +/-) при использовании в качестве панели аккордеона.


javascript extjs extjs4 extjs-mvc
person RoboKozo    schedule 18.08.2011    source источник
comment
Я попробовал это, и я могу изменить свойства кнопок по отдельности, но окно содержимого панели вкладок не сдвигается вниз, чтобы приспособиться к новой высоте. Я надеялся, что передача этих свойств кнопкам также повлияет на окно содержимого. Возможно, нет?   -  person RoboKozo    schedule 19.08.2011
comment
Хорошо. Но попробуйте изменить свойства вкладки, используя идентификатор вкладки в css. Вы можете получить конкретный css в firebug. Надеюсь, вы получите результат.   -  person Unknown    schedule 20.08.2011

Ответы (1)


arrow_upward
2
arrow_downward

Вы можете настроить вкладки на панели вкладок с помощью tabBar на tabPanel:

var tabpanel = new Ext.tab.Panel({
   plain: true,
   region: 'center',
   tabBar: {
        defaults: {
            flex: 1, // if you want them to stretch all the way
            height: 20, // set the height
            padding: 6 // set the padding
         },
        dock: 'top'
    }

});

person Sasha Brocato    schedule 18.06.2013