最大和最小的工具面板extjs

Question

我有3個面板。我使用vbox佈局。當我點擊最小和最大的工具時，我想最大化可停靠對象的面板。如何做到這一點？

Answer 1

編輯：的jsfiddle解決了面板最大化的一個窗口：here

---

我曾與一個邊界佈局之前這樣做，這是一個有點棘手。您必須隱藏其他組件，然後明確設置要最大化的面板大小。

雖然使用vBox還是很容易的。你只需隱藏其他組件，東西就會自動調整大小。

jsFiddle solution

Ext.onReady(function(){ 
    Ext.create('Ext.container.Viewport',{ 
     height:590, 
     width:590, 
     padding:'25px', 
     layout:'vbox', 
     defaults:{ 
      width:'100%', 
      tools: [{ 
       type:'maximize', 
       handler: function(a,b,c){ 
        var v = c.up('viewport'); 
        var panels = v.query('panel'); 
        Ext.Array.each(panels,function(p){ 
         if(c.ownerCt!=p){ 
          p.hide(); 
         } 
        }); 
       } 
      },{ 
       type:'minimize', 
       handler: function(a,b,c){ 
        var v = c.up('viewport'); 
        var panels = v.query('panel'); 
        Ext.Array.each(panels,function(p){ 
         p.show(); 
        }); 
       } 
      }] 
     }, 
     items:[{ 
      flex:.33, 
      title:'1', 
      html:'1' 
     },{ 

      title:'2', 
      flex:.33, 
      html:'2' 
     },{ 

      title:'3', 
      flex:.33, 
      html:'3' 
     }] 

    }); 

});