问题描述
我想根据内容大小提供可变行高.在 Slickgrid 中可能吗?
I would like to provide variable row height depending upon the content size. is it possible in Slickgrid?
你能指出一些例子吗?
推荐答案
这是可能的，但这并非微不足道，您可能会受到性能损失.SlickGrid 的工作方式，需要能够快速回答以下两个问题:
This is possible but it's not trivial and you will likely take a performance penalty. The way SlickGrid works, it needs to be able to answer the following two questions rapidly:
- 对于给定的 X 行，该行的顶部偏移量是多少?
- 对于给定的偏移量 Y，该偏移量处的行是什么?
当您使用静态行高时，回答这些问题是微不足道的；但是，对于动态行高，您需要维护一些额外的数据结构.
When you use a static row height, answering these questions is trivial; however, with dynamic row height, you'll need to maintain a couple of extra data structures.
这里大致是我在 Slick.Grid.js 中所做的更改
Here's roughly what I changed in Slick.Grid.js
- 添加一个新数组来跟踪行大小.将所有行初始化为默认大小
- 删除 createCssRules 中设置单元格高度的 css 规则
- 在 renderRows 的末尾添加一些代码，它检查行中每个单元格的渲染高度，然后将所有单元格的高度设置为最大值(并将高度存储在行大小数组中).您还需要根据当前行上方行的高度总和来调整顶部偏移.
- 在渲染的末尾添加代码以将画布大小调整为所有行高的总和.
- 更新 getViewport 以根据行高总和返回顶行和底行.
- 还有一些其他地方使用了 options.rowHeight.您可以忽略其中的一些，但至少，调整画布大小的任何地方都需要更改.
为了使其实用(高性能)，您还需要一个行顶部偏移的缓存(行大小总和的缓存).这将使第一个问题的快速计算成为可能，并允许二分搜索来回答第二个问题.
To make this practical (performant), you'll also need a cache of row top offsets (a cache of sums of row size). This will enable quick computation for the first question and will allow for binary search to answer the second.
希望能帮到你.
这篇关于SlickGrid 中是否可以使用可变行高?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！