Сенча коснитесь размера окна

Question

Проблема, с которой я столкнулся, заключается в том, что мое сенсорное приложение sencha не изменяет размер при изменении размера окна в 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 */ ]
        });
});

Часть, которую я прокомментировал, является моей попыткой заставить его изменить размер приложения, когда размеры окна изменяются, но он не может правильно рассчитать при уменьшении общего размера окна. Без попытки исправить размеры приложений такие же, как при загрузке страницы, поэтому уменьшение размера окон добавляет полосы прокрутки, а увеличение размера окна просто добавляет больше серого фона.

Надеюсь, этого фрагмента кода достаточно, чтобы понять, что происходит.

Answer 1

Я обнаружил, что это на самом деле элемент body, который не изменяется с помощью браузера. Попробуйте присоединить событие on orientationchange к панели fullscreen:true, чтобы изменить размер тела. Как это:

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

Answer 2

попробуйте tabPanel.doLayout() в вашем вызове изменения размера.

См. doLayout .

Хотя, если вам придется использовать это, вы, возможно, вышли за пределы того, на что нацеливается сенсорное прикосновение Сенча.