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' 
     }] 
    } 
});