Question

我在panel.Panel里面有一个grid.Panel布局：'card'。如何通过调整窗口大小来调整网格大小？

cards = Ext.create('Ext.panel.Panel', {
                  renderTo: 'content',
                  height: 400,
                  activeItem: 0,
                  layout: 'card'
                  items: [{
                    items: [],
                    listeners: {
                      activate: function (tab) {
                        if (tab.items.length == 0) {
                          var baseGridPanelSettings = 
                            {
                             requires: [
                              'Ext.grid.feature.Grouping',
                              'Ext.grid.column.Action'
                             ],
                             height: 400,
                             layout: 'fit',
                             resizable: true
                            }

                          var gr = new Ext.create('Ext.grid.Panel', baseGridPanelSettings);
                          gr.reconfigure(activeDataStore, colsUncontactedLeads);
                          tab.add(gr);
                          tab.doLayout();
                        }

Answer 1

在EXtJs文档中检查此功能

onWindowResize( fn, scope, [options] )

添加一个侦听器，以便在调整浏览器窗口大小时收到通知，并提供调整大小事件缓冲（100毫秒），将新视口宽度和高度传递给处理程序。在Viewport.js中添加以下代码。

Ext.EventManager.onWindowResize(function () {
           this.fireEvent('BROWSER_WINDOW_RESIZE')
        }, this, {buffer: 150});

您必须在网格中添加一个监听器来收听事件并设置网格的宽度和高度。

listeners: {
     BROWSER_WINDOW_RESIZE: this.handleResize,
     scope: this
     }

  handleResize:function(){   
           this.setHeight(Ext.getBody().getViewSize().height - 270);
           this.setWidth(Ext.getBody().getViewSize().width- 100);
         }

希望它对你有所帮助。

ExtJS grid.Panel调整大小

1 个答案: