有没有办法在选项卡面板中设置选项卡,并在ExtJS6中设置tabBarHeaderPosition?

时间:2017-07-25 20:50:14

标签: extjs extjs6

如果标签面板的标签太多,则会显示一个小滚动条,以便您滚动标签,请参阅fiddle

如果我将标签移动到标题中(从小提琴中取消注释{ "to" : "bk3RNwTe3H0:CI2k_HHwgIpoDKCIZvvDMExUdFQ3P1...", "priority" : "high", "notification" : { "body" : "This week's edition is now available.", "title" : "NewsMagazine.com", "icon" : "new" }, "data" : { "volume" : "3.21.15", "contents" : "http://www.news-magazine.com/world-week/21659772" } } ),则滚动条将不再出现。

有没有办法让标题在标题内滚动?

1 个答案:

答案 0 :(得分:1)

为tabBar设置flex似乎有效。同时为标题添加flex可以为标签栏提供更多空间。

https://fiddle.sencha.com/#view/editor&fiddle/23vc

Ext.create('Ext.tab.Panel', {
    width: 400,
    height: 400,
    activeTab: 2,
    renderTo: document.body,
    title: {
        text: 'Title',
        flex: .2
    },
    tabBarHeaderPosition: 1,
    tabBar: {
        flex: .8
    },
    items: [{
        title: 'Foo'
    }, {
        title: 'Bar'
    }, {
        title: 'some tab'
    }, {
        title: 'another tab'
    }, {
        title: 'tab 1'
    }, {
        title: 'final tab'
    }, {
        title: 'Foo'
    }, {
        title: 'Bar'
    }, {
        title: 'some tab'
    }, {
        title: 'another tab'
    }, {
        title: 'tab 1'
    }, {
        title: 'final tab'
    }]
});