Question

我正在根据浏览器窗口调整窗口大小。现在我使用Ext.getBody.getViewSize作为此的近似值。它适用于FireFox和Chrome，但不适用于IE。

Ext.define('MyProject.view.MyWindow', {
extend: 'Ext.window.Window',
alias: 'widget.myWindow',
id: 'myWindow',
width : '70%',
height: '80%',
layout : 'fit',
title: 'My Window',
bodyStyle: {
    maxHeight: '700px'
},
   listeners:{
    resize:function() {
        console.log('resize');
        var size = Ext.getBody().getViewSize();
        console.log('height = ' + size.height );
        console.log('width = ' + size.width );
        this.setHeight(.9 * size.height );
        this.setWidth(.8 * size.width );
        this.alignTo(this.container, 'c-c');
        console.log('new height = ' + size.height );
        console.log('new width = ' + size.width );
    },
    afterrender:function() {
        console.log('afterrender');
        console.log(Ext.getBody());
        var size = Ext.getBody().getViewSize();
        console.log('height = ' + size.height );
        console.log('width = ' + size.width );

        this.setHeight(.9 * size.height );
        this.setWidth(.8 * size.width );
        this.alignTo(this.container, 'c-c');
        console.log('new height = ' + size.height );
        console.log('new width = ' + size.width );

    }
},
initComponent: function() {
    this.callParent(arguments);
}
});

如果我调整IE浏览器窗口的大小，高度和宽度不会改变，但如果我调整Chrome或Firefox窗口的大小，则会更改。有没有其他方法可以使用在IE中运行的Ext.js 5来获取浏览器窗口大小？

Answer 1

您应该考虑使用Ext.Viewport。然后，您可以在此处调用getWidth和getHeight。

查看文档http://docs.sencha.com/extjs/5.1/5.1.0-apidocs/#!/api/Ext.container.Viewport

使用Ext.getBody.getViewSize（）在Ext.js中检测窗口宽度

1 个答案: