javascript - SlickGrid 中可以使用可变行高吗？

Question

我想根据内容大小提供可变的行高。在 Slickgrid 中可能吗？

你能给我举一些例子吗？

Answer 1

这是可能的，但并非微不足道，您可能会受到性能损失。 SlickGrid 的工作方式，需要能够快速回答以下两个问题:

• 对于给定的行 X，该行的顶部偏移量是多少？
• 对于给定的偏移量 Y，该偏移量处是哪一行？

当您使用静态行高时，回答这些问题很简单；但是，使用动态行高，您需要维护一些额外的数据结构。

以下是我在 Slick.Grid.js 中所做的大致更改

• 添加一个新数组来跟踪行大小。将所有行初始化为默认大小
• 删除 createCssRules 中设置单元格高度的 CSS 规则
• 在 renderRows 末尾添加一些代码，检查行中每个单元格的渲染高度，然后将所有单元格的高度设置为最大值(并将高度存储在行大小数组中)。您还需要根据当前行上方的行高度总和来调整顶部偏移量。
• 将代码添加到渲染末尾，以将 Canvas 大小调整为所有行高度的总和。
• 更新 getViewport 以根据行高总和返回顶行和底行。
• 还有一些其他地方使用了 options.rowHeight。您可以忽略其中一些，但至少，调整 Canvas 大小的任何地方都需要更改。

为了使其实用(高性能)，您还需要行顶部偏移量的缓存(行大小总和的缓存)。这将使第一个问题能够快速计算，并允许二分搜索来回答第二个问题。

希望对您有所帮助。