Панель маски ExtJS при действии сделана

Question

У меня есть внешняя панель из моего окна просмотра, и у меня есть обработчик на кнопке, которая сначала удаляет все элементы с запада, а затем рекламу другого элемента, а затем делает doLayout(). Итак, есть 3 вещи, которые эта функция делает при нажатии кнопки. Я хотел бы добавить маску к западной панели при нажатии кнопки и разоблачении после завершения всех трех задач.

Вот панель:

{ 
       region: 'west', 
       id: 'west-panel', 
       title: 'West', 
       split: true, 
       width: 200, 
       minSize: 175, 
       maxSize: 400, 
       collapsible: true, 
       margins: '0 0 0 5', 
       layout: 'fit' 
       items: [leftMenu] 
      } 

И это, как я делаю задачи:

west.removeAll(); 
west.add(indexHeaderPanel); 
west.doLayout(); 

возможно ли это? Я попрошу дать дополнительную информацию. Спасибо.

Answer 1

Вы буквально просто маскируете(), а затем размаскиваете() до и после блока кода. Если что-то в вашем коде выполняется асинхронно, вы просто убедитесь, что маска выполняется в соответствующем обратном вызове. В качестве примера:

buttons: [{ 
     text: 'Refresh West Panel', 
     handler: function(){ 
      var w = Ext.getCmp('west-panel'); 
      w.getEl().mask(); 
      w.removeAll(); 
      w.add(indexHeaderPanel); // assuming you have this ref! 
      w.doLayout(); 
      w.getEl().unmask(); 
     } 
    }] 

Если ваша логика выполняется достаточно быстро, вы никогда не увидите маскировку. Для того, чтобы убедиться, что он работает, Вы можете поместить в задержке тест:.

buttons: [{ 
     text: 'Foo', 
     handler: function(){ 
      var w = Ext.getCmp('west-panel'); 
      w.getEl().mask(); 

      // do whatever 

      (function(){ 
       w.getEl().unmask(); 
      }).defer(1000, this); 
     } 
    }] 

w.getEl() [ООН] маска() маскирует всю панель (в том числе верхний/нижний). Чтобы замаскировать только содержимое, сделайте w. корпус. [Un] маска().