javascript - 分组标题列大小

标签 javascript extjs extjs4

我有一个分组标题网格。网格定义可以在 fiddle 中找到 here .

结果如下所示。

enter image description here

我希望所有列的间距都相等,包括分组标题内的列。我做错了什么?

最佳答案

Ext JS 目前不支持这种行为。我有这个完全相同的问题。这并不是真正的错误,因为源代码明确指出你不能这样做,但这似乎是网格的最大缺点之一(紧挨着锁定列)。

我的解决方案是覆盖 Ext.grid.ColumnLayout#completeLayout 4.1.0 中的方法。这是确定子项目(列)宽度的地方。您基本上要做的是获取网格可用的总宽度(可通过提供的布局/上下文对象获得)并在所有叶列上手动转换 flex->width 。然后,对于每组列,您可以对计算出的宽度求和并设置父级宽度。在 completeLayout 方法中执行此操作意味着它会在每个布局期间自动运行,因此您不必忙于观看调整大小事件等。

只要有一个好的调试器和足够的耐心,您就可以解决这个问题。我想发布一个代码示例,但我的解决方案大约有 100 行,并且是我工作代码的一部分。不过,我仍然可以指出一些注意事项:

  1. 如果您只需要支持 2 级 header ,则不必费心使整个方法递归 3 级以上。亚格尼。

  2. 注意隐藏的列。我相信有一个错误,隐藏的组标题没有在子列上设置隐藏属性。我的一个更常见的问题是,显示一个专栏会以奇怪的方式改变一切。

  3. 注意未密封的组。我通过密封每列来解决这个问题,但如果能够自由移动列是您要求的一部分,那么您可能需要采取额外的步骤。

老实说,最好的解决方案是将此作为功能请求提交到 Sencha 论坛,并询问他们为什么 Ext JS 库中仍然不存在如此重要的功能。

编辑: 将源代码发布到 Sencha support forums .

关于javascript - 分组标题列大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12401805/

相关文章:

javascript - 使用 JSON.stringify 和 JSON.parse 将多边形坐标存储到 oracle 中

javascript - div insidehtml 不采用 html

extjs - 使用osx和zsh安装Sencha Command问题

javascript - ExtJS 4 日期选择器。给细胞着色

javascript - 动态添加到 DOM 的对象不响应 jQuery 事件

javascript - 如何在 JavaScript 的循环中处理异步代码?

javascript - Ext JS 存储和复杂对象

javascript - Extjs 更改显示字段的字体大小

javascript - afterLabelTextTpl 在 extjs4 中的使用

javascript - 如何在 Extjs checkcolumn 中获取 id?