Автоматическое изменение размера панели при изменении размера окна

Question

Я использую пример array-grid extjs, чтобы попытаться вписать панель сетки в окно контейнера. Проблема заключается в изменении размера окна контейнера, панель сетки автоматически не соответствует новому размеру. Насколько я понимаю, так и должно быть.

Вот ссылка на пример: http://www.extjs.com/deploy/dev/examples/grid/array-grid.html

То, что я сделал, изменило следующее ..

// Added to gridpanel config
layout: 'fit',
viewConfig: {
    forceFit: true
}

// Window container
var gridWindow = new Ext.Window({
    items: [
        grid
    ]
});

// Instead of grid.render, use gridWindow.show();
gridWindow.show();

Answer 1

Я использую следующий обходной путь:

Ext.onReady(function () {
    var grid = ... //define your grid here

    Ext.EventManager.onWindowResize(function () {
        grid.setSize(undefined, undefined);
    });
});

Extjs v4.0.7

Answer 2

layout: 'fit',

должен войти в конфигурацию gridWindow! Менеджер по расположению размещает дочерние элементы панели, но сетка является дочерней.

Answer 3

Я решил эту проблему, обернув свою сеточную панель в Ext.Panel, установив для свойства макета значение fit Панель сетки (с viewConfig, также содержащим forceFit: 'true' теперь изменяется автоматически при изменении размера окна

Answer 4

Используя ExtJS 6, это то, что у меня сработало (не нужен Ext.Viewport в качестве родительского контейнера):

var grid = //...

Ext.on('resize', function(w, h){
  grid.updateLayout();
});

Answer 5

Я думаю, вам нужно использовать класс EventManager. Пожалуйста, прочтите его в следующем блоге