Заголовки и подзаголовки - не занимают 100% ширины таблицы
 

Здравствуйте!

Как сделать, чтобы заголовки столбцов занимали 100% ширины таблицы? Сейчас они кучкуются слева.

Ext JS версии 5.1.0

Пример в песочнице: https://fiddle.sencha.com/#fiddle/l2c

Код:

Ext.define("Example.transview", {
	extend: "Ext.grid.Panel",
	
	columns: [{
		text: "Трансформация",
		columns: [{
			text: "Тип",
			dataIndex: "type",
			flex: 2
		}, {
			text: "Масштаб",
			dataIndex: "scale",
			flex: 5
		}, {
			text: "Перемещение",
			columns: [{
				text: "X",
				dataIndex: "tx",
				flex: 1
			}, {
				text: "Y",
				dataIndex: "ty",
				flex: 1
			}]
		}]
	}, {
		text: "Мышь",
		columns: [{
			text: "X",
			dataIndex: "mx",
			flex: 1
		}, {
			text: "Y",
			dataIndex: "my",
			flex: 1
		}]
	}]

***
	
});

...
text: "Трансформация",
flex: 1,
...
text: "Мышь",
flex: 1,
...

Не поможет?

Это запрещено делать)))) увы...

Не поддерживает ведь не значит, что запрещено. Или все-таки чем-то чревато?

Чревато тем, что выдает ошибку и останавливает программу. Вот текст ошибки:

{text: "X",align: 'center',dataIndex: "tx"}

Не работает.

Добавил. Можно посмотреть тут https://fiddle.sencha.com/#fiddle/l2c

Все равно колонки кучкуются слева, а не растягиваются на всю ширь окна.

угу, вспомнил. была такая проблема.
я решил только заданием точной ширины колонки. в пикселях.
и на изменение размера - пересчет всех колонок.