Изменение непрозрачности маски за модальным окном extjs4

Question

Я хочу изменить непрозрачность маски за модальным окном. Я хочу сделать это непрозрачным. И это должно быть только для одного окна. Может кто-нибудь сказать мне, как я могу это сделать? Я старался

    this.getEl().setOpacity(1);
    this.mask.setStyle('opacity', 1);
    this.el.mask().setStyle('opacity',1); 

Я пробовал эти три кода, но ни один из них не работал.

Answer 1

Имел аналогичное требование, использовал domQuery для получения 'x-mask' el и добавил css для изменения непрозрачности.

например, окно на шоу..

show: function(win) {
            if (this.modal) {
                var dom = Ext.dom.Query.select('.x-mask');
                var el = Ext.get(dom[0]);
                el.addCls('customWinMask'); //remove on hide
            }
}

CSS:

.customWinMask.x-mask {
        filter: alpha(opacity=50);
        opacity: .5;
        background: blue !important; 
}

рабочая скрипка: https://fiddle.sencha.com/

Answer 2

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

 show: function(win) {
           if (this.modal) {
                     var dom = Ext.dom.Query.select('.x-mask');
                     for(var i=0; i<dom.length;i++){
                         Ext.get(dom[i]).setStyle('opacity',1);
                     }
           }
},


 close:  function(win) {
                 if (this.modal) {
                     var dom = Ext.dom.Query.select('.x-mask');
                     for(var i=0; i<dom.length;i++){
                         Ext.get(dom[i]).setStyle('opacity',0);
                     }
                 }
}

Answer 3

Вы можете использовать переменные sass для Ext.LoadMask, например:

$loadmask-opacity:0.3;
$loadmask-page-opacity:$loadmask-opacity;

Правила для ExtJs v6.0

Answer 4

user2316489, вы должны изменить непрозрачность от 1 до 0,5, например:

. This.getEl() setOpacity(0,5); this.el.mask() SetStyle('непрозрачности',0,5).

Answer 5

Перейдите в sass > etc > all.scss и поместите этот код:

.x-mask {
    opacity : 0.3
}

Это прекрасно в extjs 6.0