Как покрыть два перекрывающихся компонента маской в ​​Sencha Ext JS?

Question

В Sencha я могу маскировать фоновый компонент и красиво вызывать компонент диалога, вызывая this.view.mask () для фонового компонента.

Затем, когда я нажимаю «Submit» в В верхнем диалоговом окне я хочу, чтобы маска покрывала диалоговое окно и компонент фона вместе, а не просто маскировала меньшее диалоговое окно. Я не хочу просто замаскировать диалоговое окно, потому что, хотя фон тоже замаскирован, граница диалогового окна по-прежнему явно яркая.

Как я могу замаскировать оба компонента вместе?

В диалоговом окне я пробовал this.view.mask («Загрузка ...»), но маскируется только небольшое диалоговое окно. Его граница по-прежнему ярко светится, поэтому ясно, что мы просто помещаем маску в маленькое диалоговое окно, а не на всю страницу.

Я попытался запросить фоновый компонент с помощью view = Ext.ComponentQuery.query (' MyComponent ') [0], а затем с помощью view.mask («Загрузка»), но это только добавляет маску к этому компоненту фона.

Answer 1

Это уродливое решение, но оно сработало для меня. Проверено на 7.0.0

var wnd = Ext.getCmp('window'), // just an example - Ext.getCmp() use is frowned upon :)
    wndSize = wnd.getSize(),
    myMask;

myMask = new Ext.LoadMask({
    msg    : 'Please wait...',
    target : wnd,
    height: wndSize.height,
    width: wndSize.width
});

myMask.show().setXY(wnd.getXY());