Question

强调文字当使用panel.Grid属性列设置width中列的宽度时，按grid.columns[index].setWidth(width)调整大小可以正常工作。但是当列的宽度由flex设置时，此代码不起作用。

只是说清楚：我正在尝试在两个网格上同步列resize / move / hide / etc事件。

因此两个网格的列基本相同：

me.columns = {
        defaults: {
            renderer: tooltipRenderer
        },
        items: [
            {
                header: "product",
                dataIndex: 'product',
                groupable: false,
                flex: 1
            },                

            {
                header:'Value',
                dataIndex: 'vlue',
                align: 'right',
                renderer: Ext.util.Format.numberRenderer('0,000.00'),
                summaryType: 'remote',
                summaryRenderer: Ext.util.Format.numberRenderer('0,000.00'),
                groupable: false,
                flex: 1
            }
        ]
    };

插件中的代码同步列调整大小：

firstGrid.on('columnresize', function (ct, column, width) {
        console.log('fgrid: ' + width + ' column name: ' + column.dataIndex);
        secondGrid.columns[column.getIndex()].setWidth(width);
    }, firstGrid);

secondGrid.on('columnresize', function (ct, column, width) {
        console.log('sGrid: ' + width + ' column name: ' + column.dataIndex);
        firstGrid.columns[column.getIndex()].setWidth(width);
    }, secondGrid);

所以，我现在拥有的：当我在一个网格中调整宽度由flex设置的列时，另一个网格对应的列不会改变它的宽度，但是如果在一个网格中调整列大小后我调整了一个其他一切都正常应用。我希望这个描述不是太奇怪。

Answer 1

你不应该在布局管理宽度的地方设置宽度。如果删除列的flex属性，则setWidth有效 https://fiddle.sencha.com/#fiddle/4b4

我的示例切换了flex属性，因此您可以设置宽度，尝试单击页面，您将看到弯曲的列更改宽度

// Assume you have a variable gridwhere the second column is flexed.
Ext.getBody().on('click', function() {
    var emailCol = grid.query('gridcolumn')[1];
    if (emailCol.flex) {
        delete emailCol.flex;
        emailCol.setWidth(100);
    } else {
        emailCol.flex = 1;
        grid.doLayout();
    }              
});

如何在应用flex时使用ExtJS 4中的grid.columns [index] .setWidth（width）来调整列的大小？

1 个答案: