ExtJs加载遮罩位移

Question

我在使用加载掩码时遇到了 Extjs 4.1.1 的一些问题。

我创建了一个自定义 window 并在按下按钮时设置了加载掩码

var options=Ext.create('Ext.window.window',{
    title:'this window',
    height:200,
    width:100,
 items: {  // Let's put an empty grid in just to illustrate fit layout
        xtype: 'grid',
        border: false,
        columns: [{header: 'World'}],              
        store: Ext.create('Ext.data.ArrayStore', {}) // A dummy empty data store
    }
}).show();

options.setLoading('Loading...');

启用加载蒙版后，如果我打开另一个 window 蒙版会从其位置移位，这是不可取的。我应该如何防止其他windows影响加载掩码。

或者我应该将蒙版覆盖在整个框架上而不是只覆盖 window？

Answer 1

如果需要创建重复的windows，您可以检查之前创建的window。如果退出，则不需要setLoading。看看这个：https://fiddle.sencha.com/#fiddle/tv5

    var me = this;
    var x = 50;
    var button = Ext.create('Ext.button.Button', {
        text: 'click',
        renderTo: Ext.getBody(),
        closable: true,
        handler: function() {

            me.options = Ext.create('Ext.window.Window',{
                title:'this window',
                height:200,
                width:400,
                items: {  // Let's put an empty grid in just to illustrate fit layout
                    xtype: 'panel',
                    html: 'here' // A dummy empty data store
                }
            });

            me.options.show();

            me.options.setXY([x+30, x+30]);
            me.options.mask('Loading1...');

        }
    });

    var button2 = Ext.create('Ext.button.Button', {
        text: 'click',
        renderTo: Ext.getBody(),
        closable: true,
        handler: function() {
            me.options2 = Ext.create('Ext.window.Window',{
                title:'this window',
                height:200,
                width:400,
                items: {  // Let's put an empty grid in just to illustrate fit layout
                    xtype: 'panel',
                    html: 'here' // A dummy empty data store
                }
            });

            me.options2.show();

            me.options2.setXY([x+200, x+300]);

            me.options2.mask('Loading2...');

        }
    });

ExtJs加载遮罩位移

ExtJs loading mask displacement

javascript

extjs

mask

loading