ExtJS：如何基于移动浏览器制作面板全屏

Question

我的网站有一个带有下拉按钮的顶栏和一个带有其他信息的底栏。在主体中我有一个带有2个项目的面板 - ＆gt;地图和网格。 在地图上我有一个可以检测移动浏览器的后悔监听器。在检测到移动浏览器时，我想让地图全屏移除窗口中的所有其他内容，添加一个按钮以返回常规屏幕。

items: [{
                xtype: 'gmappanel',                
                listeners: {                    
                    afterrender: function(map, eOpts){
                        var isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent);
                        if (isMobile) {
                          //make the map full screen
                        }

                    } 
                }            
            },
            anotherGrid
            ]

Answer 1

您可以将gmap面板打包到一个配置最大化的窗口中：

Ext.create('Ext.window.Window', {
    maximized: true,
    title: 'Map',
    frame: false,
    modal: true,
    renderTo: Ext.getBody()
}).show();

https://fiddle.sencha.com/#fiddle/1gnj