当 window 最大化时,extjs 3.4 列未完全展开

extjs 3.4 column not fully expanding when window is maximised

我正在创建一个使用多个 Panel 组件的 EXT 应用程序。其中之一是包含单个 ColumnGridPanel。在我的 GridPanel 中,我将 autoExpandColumn 配置设置为此 Column 因为我的 Panel 组件之一是可折叠的,所以当它折叠时其他 Panel 组件展开并且 Column 也会展开。当 Window 处于其正常大小并且可折叠 Panel 被折叠时,Column 会展开以占据 GridPanel 的整个宽度。但是,当 Window 最大化时,该列不会展开,而是保持与 window 最大化且可折叠 Panel 未折叠时相同的宽度(这是比 Window 处于正常大小时更大)。 Window 有一个 BorderLayout 这就是前两个 Panel 组件使用 region 属性.

的原因

相关代码如下:

Window 的配置:

                title: 'Engineering Works',
                width: 915,
                height: 550,
//                minHeight: 550,
//                minWidth: 915,
                resizable: false,
                padding: 10,
                shim:false,
//                monitorResize: true,
                confirmClose: true,
                animCollapse:false,
                constrainHeader:true,
                style: {
                    margin: "10px"
                },
                layout: "border",
                items: [filterFormPanel,centrePanel]

可折叠面板:

var filterFormPanel = new Ext.FormPanel({
    region: "west",
    monitorResize:true,
    width: "38%",
    title: "Filter",
    collapsible: true,
    id: windowId + "filter",
    items: [stationsPanel, datesPanel, daysPanel, impactPanel, searchButton]
});

centrePanel(包含另外两个面板,第一个面板 (searchResultsPanel) 是上面解释的 GridPanel

   var centrePanel = new Ext.Panel({
        region: "center",
        layout:'border',
        monitorResize:true,
        items: [searchResultsPanel,individualResultPanel]
    });

searchResultsPanel(包含我省略的 rowclick 侦听器,因为它很长且与此问题无关):

    var searchResultsPanel = new Ext.grid.GridPanel({
        title: "All Results",
        id: windowId + "allresults",
        border: false,
        monitorResize:true,
        autoScroll: true,
        region:'center',
        forceFit: true,
        colModel:  myColumnModel,
        autoExpandColumn: windowId + "summarycolumn",
        store: mystore
    });

值得指出的是 GridPanel 本身确实在任何时候都可以正常扩展,只是里面的 ColumnWindow 最大化,filterFormPanel 折叠。

我试过了,没有成功:

  1. 根据 this 问题(和其他一些问题),将 searchResultsPanel 放入其自己的父 Panel 中并为其提供合适的布局。无论如何,我意识到这可能没有实际意义,因为这涉及到 GridPanel 没有扩展,我没有遇到过这个问题。
  2. Columnwidth 配置设置为在可折叠 Panel 折叠和展开时等于 GridPanel 的宽度。这并没有解决我的问题,并导致折叠的 Panel 展开时右侧的 Panel 组件(在 centrePanel 内)出现水平滚动条。

我通过删除 GridPanel 中的 autoExpandColumn 配置并用 viewConfig 围绕 forceFit 配置解决了这个问题,因为它是 GridView 组件的配置。所以我的 GridPanel 现在看起来像这样(减去听众):

var searchResultsPanel = new Ext.grid.GridPanel({
    title: "All Results",
    id: windowId + "allresults",
    border: false,
    monitorResize:true,
    autoScroll: true,
    region:'center',
    colModel:  myColumnModel,
    viewConfig: {
        forceFit: true
    },
    store: mystore
});