如何创建具有固定宽度和弹性宽度列的ExtJs仪表板？

In ExtJs6, we can config the column width with: columnWidths:[0.1, 0.7, 0.2], This will make the columns with 10%,70% and 20% of the dashboard's whole width.

在ExtJs6中,我们可以使用以下命令配置列宽:columnWidths:[0.1,0.7,0.2],这将使列占仪表板整个宽度的10%,70%和20%。

But I want to make the first and third columns have a fixed width, and the middle one always has the left.

但我想让第一列和第三列具有固定宽度,而中间一列始终具有左侧。

Anybody has ideas?

有人有想法吗?

2 个解决方案

#1

I'd use a border layout instead. The left and right regions (west and east) would be given those fixed widths. The center region is your middle and by default takes all of the remaining width.

我会改用边框布局。左侧和右侧区域(西侧和东侧)将被赋予那些固定宽度。中间区域是您的中间区域,默认情况下将占用所有剩余宽度。

#2

According to the Ext.layout.container.Column description you can do something like this:

根据Ext.layout.container.Column描述,您可以执行以下操作:

// Mix of width and columnWidth -- all columnWidth values must add up
// to 1. The first column will take up exactly 120px, and the last two
// columns will fill the remaining container width.

Ext.create('Ext.Panel', {
    title: 'Column Layout - Mixed',
    layout:'column',
    items: [{
        title: 'Column 1',
        width: 120
    },{
        title: 'Column 2',
        columnWidth: 0.7
    },{
        title: 'Column 3',
        columnWidth: 0.3
    }],
    renderTo: Ext.getBody()
});

#1