sencha触摸窗口调整大小

时间:2011-03-08 00:21:03

标签: javascript sencha-touch extjs

我遇到的问题是我的sencha touch应用程序在调整Chrome窗口大小时不会调整大小

我正在使用的代码示例:

Ext.setup({
    glossOnIcon: false,
    onReady: function() {

        //added this as a dirty hax to get it to atleast try to resize
        Ext.EventManager.onWindowResize(function () {
            wialus.tabPanel.setOrientation(Ext.getOrientation(), window.innerWidth, window.innerHeight);
        });

        my.tabPanel = new Ext.TabPanel({
            tabBar: {
                dock: 'bottom',
                layout: {
                    pack: 'center'
                }
            },
            fullscreen: true,
            ui: 'light',
            items: [ /* items here */ ]
        });
});

我评论过的部分是我尝试在窗口尺寸发生变化时调整应用程序大小,但在减小窗口的整体大小时无法正确计算。如果没有尝试修复,应用程序的尺寸与加载页面时的尺寸相同,因此减小窗口大小会增加滚动条并增加窗口大小只会增加更多的灰色背景。

希望代码片段足以让我们了解正在发生的事情。

2 个答案:

答案 0 :(得分:4)

我发现它实际上是没有使用浏览器调整大小的body元素。尝试将orientationchange事件附加到fullscreen:true面板以调整身体大小。像这样:

my.tabPanel.on('orientationchange', function() {
  this.el.parent().setSize(window.innerWidth, window.innerHeight);
});

答案 1 :(得分:0)

在调整大小调用中尝试tabPanel.doLayout()

请参阅doLayout

虽然如果你不得不使用它,你可能已经超越了当前针对的sencha touch。