Ext JS tabpanel不適合窗口大小

Question

有人希望在Ext JS中完成一個面板來動態調整窗口大小。我對Ext並不熟悉，但經過幾個小時的搜索之後，我還沒有找到一個可行的解決方案。這裏是預期的代碼是固定的：

var histotab = Ext.createWidget('tabpanel', { 
     activeTab: 0, 
    width : 2000, 
    height : "50%", 
    defaults :{ 
     bodyPadding: 10 
    }, 
    items: [ 
     { 
      id: 'chartCmp', 
      title: 'By Year', 
      xtype: 'chart', 
      style: 'background:#fff', 
      layout:'fit', 
      animate: true, 
     shadow: true, 
      store:SOD.storeHistogram, 
      axes: [{ 
     type: 'Numeric', 
     position: 'left', 
     fields: ['countoffiles'], 
     label: { 
      font: '8px Arial' 
     }, 

任何建議，非常感謝。

Answer 1

使用適合佈局的Ext.container.Viewport類。該視口始終將自己的大小設置爲文檔視圖大小。

Ext.widget('viewport', { 
    layout: 'fit', 
    items: { 
     xtype: 'tabpanel', 
     items: [{ 
      title: 'Foo', 
      html: 'First tab' 
     }] 
    } 
});