variable list content size?

[Textras]

Is there a way to not specify the item height? We are loading a lot of items with a different content size which essentially means different item heights.

As the ag-grid component explains here https://www.ag-grid.com/javascript-grid-row-height/?framework=vue#gsc.tab=0, You cannot use variable row height when doing virtual paging or viewport. This is because these row models need to work out the position of rows that are not loaded and hence need to assume the row height is fixed. They use getRowHeight() callback, wondering if we can use something similar here?

[tangbc]

@Textras thank you for providing this, consider to put it in the feature plan.

[tangbc]

For variable row height, I looked at the implementation of other libraries, most implementations have only two ways, one is that you mentioned above getRowHeight callback, and the other is give an array contains the heights of all items.

So I think these two ways can implement together by supporting prop size for Number, Array and Function value type, that should be done well.

[andreixk]

This would be an awesome feature. Here's another idea of how to possibly implement it:
the padding on top and bottom don't need to reflect the "actual" height of all those elements, they simply need to reflect the relative position of the visible chunk within the list. so if there are 30000 elements and the visible ones are 3000-3008, then there should be about 10% of padding on top and about 90% of padding on the bottom. so when the user gets to item #15000 then you'll have 50% on top and 50% on the bottom regardless of how tall each element actually is.

[tangbc]

@andreixk Thank your idea, I plan to finish it recently.

[andreixk]

I mocked up a sample here but it only works when you scroll relatively slowly - fails when you scroll fast. I did it slightly differently though - i keep the height of each child that was scrolled out of view at the top. So the downside is that it'll have a scrollbar that changes size when you scroll down.

[tangbc]

Already supported in v1.1.6

[tangbc]

I mainly implement by two methods:

First, use binary search to calculate scrolled over items, then can be work out the start and end.

Second, use estimate padding avoid too much calculate, it always use a estimate padding until really scrolled to it.