如何用ExtJs製作100％高度和寬度的窗口？

Question

這一個沒有工作：

new Ext.Window({ 
    width:'100%', 
    height: '100%' 
}).show(); 

我有做是流動的，因此，當窗口大小有改變其diemensions。

Answer 1

這也可以通過創建一個視口來實現，該視口旨在完成您所要求的功能。這裏有一個簡單的例子，它表明你不需要指定任何的高度/寬度：

​​

你會注意到，你甚至都不需要「秀」吧。

編輯：哦，我的意思是還要說，如果你添加一些更長的內容到這些html部分，你會看到如果你調整瀏覽器窗口的大小，他們會自動改變他們的高度，讓所有的內容被看到。

Answer 2

這隻能通過監視window.resize事件來實現。

Ext.onReady(function() { 
    var win = new Ext.Window({ 
     draggable: false 
    }); 

    win.show(); 

    win.setSize(Ext.getBody().getViewSize()); 
    win.setPagePosition(0, 0); 
    Ext.fly(window).on('resize', function(e, w) { 
     win.setSize(Ext.getBody().getViewSize()); 
     win.setPagePosition(0, 0); 
    }); 
}); 

請注意，我的例子中正常工作，如果body有overflow: hidden。否則會顯示不需要的滾動條。

看看這個fiddle。