我有一个Sencha Ext.js Gridpanel,最后一列中的文本超出了网格的边缘。知道为什么会这样吗?最后一列(引用)也不可调整大小。我完全是ExtJS的新手。下面的屏幕截图。用蓝色标记的问题区域。
soat7uwm1#
您可能已经为每个列设置了固定宽度?在这种情况下,您可以将弹性值(例如1)设置为最后一列。这样,列将占据右侧的“空闲”空间。当然,您可以将flex值赋给任何其他列。在我看来,主要问题是“未使用”的空间。下面是一个代码示例:
columns: [ { text: 'First column', dataIndex: 'fc', width: 200 }, { text: 'Second column', dataIndex: 'sc'; width: 50 }, { text: 'Third column', dataIndex: 'tc', flex: 1 } ],
7eumitmz2#
正如@KaMun建议的那样,您有一个未使用空间的问题!使用整个网格空间快速构建每个列宽度的一个好方法是列的flex配置。对于我的网格,默认情况下,我喜欢通过在列的默认值中定义它来给每个列相同的“权重”(flex=1)。如果您确定某些列将始终具有相同的大小,则可以始终覆盖flex配置,指定列的宽度。在下一个示例中,最后一列的固定宽度为120,而其他两列将以50%-50%的方式划分剩余空间,因为它们共享相同的权重(flex=1):
columns: { defaults: { flex: 1 }, items: [ { text: "First Name", dataIndex: "firstName"}, { text: "Last Name", dataIndex: "lastName"}, { text: "Birth Date", dataIndex: "birthDate", xtype: "datecolumnn", width: 120} ] }
2条答案
按热度按时间soat7uwm1#
您可能已经为每个列设置了固定宽度?
在这种情况下,您可以将弹性值(例如1)设置为最后一列。
这样,列将占据右侧的“空闲”空间。
当然,您可以将flex值赋给任何其他列。在我看来,主要问题是“未使用”的空间。
下面是一个代码示例:
7eumitmz2#
正如@KaMun建议的那样,您有一个未使用空间的问题!使用整个网格空间快速构建每个列宽度的一个好方法是列的flex配置。
对于我的网格,默认情况下,我喜欢通过在列的默认值中定义它来给每个列相同的“权重”(flex=1)。如果您确定某些列将始终具有相同的大小,则可以始终覆盖flex配置,指定列的宽度。
在下一个示例中,最后一列的固定宽度为120,而其他两列将以50%-50%的方式划分剩余空间,因为它们共享相同的权重(flex=1):