ExtJS的使電網是100％高度

我發現這裏2個類似的問題，但他們不幫我，我的代碼是：ExtJS的使電網是100％高度

var grid = Ext.create('Ext.grid.Panel', { 
    autoScroll: true, 
    // if set this to any numeric value, then everything works just good, but 
    // i was hoping that `ExtJS` already can detect browser window height, am i wrong ? 
    height: '100%', 
    title: 'Products', 
    store: store, 
    itemId: 'product_grid', 
    columns: [.. columns skipped ...], 
    plugins: [ rowEditing ], 
    dockedItems: [ ..addRow button here..] 
}); 
var panel = Ext.create('Ext.panel.Panel', { 
    autoScroll: true, 
    items: [ 
    { 
     xtype: 'productGrid' 
    } 
    ] 
}); 
Ext.create('Ext.container.Viewport', { 
    layout: 'fit', 
    items: panel 
});

我需要什麼，我可滾動的網格填充整個瀏覽器窗口，但電網這裏不會擴展高度爲，所以如果網格有0行，那麼它的高度爲0，當我按「添加行」時，添加的行看起來被滾動條遮住了，這看起來很醜。

此外，當網格包含的行數超過瀏覽器窗口的容量時，頁面滾動條出現（不是網格的滾動條！），這會滾動整個頁面，因此按鈕條滾動消失，這也是不理想和醜陋的。

任何想法我的設置有什麼問題。

UPDATE：

最後修好了，中間面板還應該包含佈局： '適應'

來源

2012-08-28 Dfr

嘗試期運用'fit'佈局 –

我expirimented不斷變化的佈局，但沒有成功 – Dfr

當我添加動態行的話，我想我應該叫類似的doLayout，但其成分？ – Dfr

有幾件事情，你可以在這裏做。首先，在視口上使用fit佈局，因爲它會強制其子組件填充可用空間。其次，網格是面板。您不需要在面板中嵌套網格，也可能不應該。

autoScroll config在網格上不起作用。雙向滾動默認爲啓用，但如果需要更改，請使用scroll屬性。最後，height配置只接收一個數字，不能與字符串或百分比一起使用。如果指定高度，它將覆蓋佈局管理器給出的任何高度，並且您不需要它爲fit佈局。

var grid = Ext.create('Ext.grid.Panel', { 
    title:  'Products', 
    store:  store, 
    itemId:  'product_grid', 
    columns:  [/* ... */], 
    plugins:  [rowEditing], 
    dockedItems: [/* ... */] 
}); 

var viewport = Ext.create('Ext.container.Viewport', { 
    layout: 'fit', 
    items: [grid] 
});

來源

2012-08-28 12:07:12 Eric

我嘗試設置合適的佈局，但一切看起來都一樣 – Dfr

如果您發佈了屏幕截圖，找出發生了什麼問題會更容易。另外，你如何添加你的行？ – Eric

只是修好了，忘了給中間面板添加'fit'佈局選項，我的不好。是的，'layout：fit'是解決方案。 – Dfr

添加viewConfig到電網，奇怪的是，解決了我的具有浮動窗口VBOX佈局沒有明確的GridPanel高度的問題，包含只是一種形式和一個網格。

xtype: 'gridpanel', 
 
store: 'DCLocations', 
 
columnLines: true, 
 
autoScroll : true, 
 
viewConfig : { 
 
     emptyText : i18n.message.noresultstodisplay, 
 
},

來源

2014-12-03 18:51:53

ExtJS的使電網是100％高度

回答

相關問題