extjs 6.2.0 сетка столбца установить ширину по заголовку (заголовок)

Question

Как установить ширину столбцов по заголовку (заголовку) в extjs 6.2.0?

Я хочу автоматически устанавливать ширину столбцов по их заголовкам.

Answer 1

Ширина столбца должна быть нулевой:

var c = Ext.create('Ext.grid.column.Column', { text: 'Nam12131231313e', dataIndex: 'name', width: null});

Answer 2

Как вы можете видеть, я создал функцию getColumnWidth(), она будет принимать текст столбца сетки в качестве параметра и затем возвращать ширину столбца.

Вы также можете настроить числа в getColumnWidth () по своему усмотрению.

Ссылка Sencha Fiddle https://fiddle.sencha.com/

Ext.application({
    name : 'Fiddle',
    launch : function() {
        Ext.create('Ext.window.Window',{
  title:'Grid Auto Fit Column Width Based on Header Text',
  width:600,
  height:400,
  autoShow:true,
  layout:'fit',
  items:[{
      xtype:'grid',
      columns:[
          {
              text:'id',
              width:this.getColumnWidth('id'),
          },{
              text:'Name',
              width:this.getColumnWidth('Name'),
          },{
                 text:'ThisWillFitItsData',
              width:this.getColumnWidth('ThisWillFitItsData')
          },{
                 text:'LetsTryMoreLongerText',
              width:this.getColumnWidth('LetsTryMoreLongerText')
          },{
              text:'Fixed',
              width:60
          }
          ]
      }]
 });
    },
    getColumnWidth:function(text){
        let columnWidth = (text.length * 7) + 35  // giving 7 pixles for each letter in the text
        //Optional This part is used to set a maximum column width in case there is too many charachter in the text
        if(columnWidth>400){
            columnWidth = 400
        }
        return columnWidth;
    }
});