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

Иногда нам нужно показывать содержимое всех ячеек таблицы, не сокращая их. Для этого вы можете использовать плагин с автоматическим изменением размера колонки. Плагин не работает со flexed столбцами, он просто удаляет свойство flex. Чтобы сохранить свойство flex, вам нужно проверить, указан ли flex для этой колонки и не использовать метод autoSize. Данный функционал мы реализуем в виде override, для активации функционала установите свойство колонки enableAutoResizeColumns в true.

Ext.define('overrides.grid.Panel', {
    override: 'Ext.grid.Panel',

    enableAutoResizeColumns: false,

    initComponent: function () {
        this.callParent();
        if (this.enableAutoResizeColumns) {
            this.getStore().on('datachanged', this.autoResizeColumns, this);
        }
    },

    autoResizeColumns: function () {
        this.columns.forEach(function (column) {
            var columnFlex = column.flex;
            column.autoSize();
        });
        return true;
    }
});

В примере ниже вы можете генерировать случайные данные и редактировать содержимое ячеек.

Fiddle: