Question

我将tabPanel的tabBar放在顶部位置并保持底部样式，所以请参考this thread，显示结果没问题，但标签栏没有扩展所有空间，页面右上角显示背景。（我的1024px分辨率大约30px）。当使用Chrome查看它时，如果我打开开发者工具然后关闭它，那么标签栏就可以了。（占据所有屏幕）。我尝试tabPanel.doLayout（）或viewPort.doLayout（），两者都不起作用。

请提出任何建议，谢谢！

var tabPanel = new Ext.TabPanel({
        id:'tabPanel',  
        tabBar : {
            dock : 'top',
            layout : { pack : 'right' },
        },
        listeners: {
                single: true,
                afterlayout: function (panel) {
                    var dom = Ext.select('.x-docked-top', panel.getEl().dom).first().dom;
                    dom.className = dom.className.replace('x-docked-top', 'x-docked-bottom');                   
                }
        },
        defaults: {
                scroll: 'vertical'
        },
        cardSwitchAnimation: {
            type: 'slide',
            duration: 1
        },
        flex: 1,
        ui: 'light',
        items : [
            {
                iconCls : 'icon1',
                items: [ scanPanel ]        
            },
            {
                iconCls : 'icon2',
                items: [ logPanel ]         
            }
        ]       
});

...

var viewPort = new Ext.Panel({
    fullscreen : true,
    layout : {
        type : 'fit',
        align : 'stretch'
    },
    items : [ tabPanel]
});

Answer 1

Ext.Panel有一个默认的填充设置，尝试将tabBar移动到Ext.Panel。

sencha touch：标签栏的宽度不会延伸到屏幕宽度

1 个答案: