search

gnir-work / react-window-dynamic-list

A naive approach to virtualizing a dynamically sized list
49 stars 9 forks source link

Some cells heights are incorrect #1

Closed mathieuleddet closed 4 years ago

mathieuleddet commented 4 years ago

Hi!

Thanks for looking at how to solve dynamic item size for react-window and thanks for sharing your solutions.

I am giving a try at your implementation but I am experiencing a problem that I can also observe in your demo here : https://gnir-work.github.io/react-window-dynamic-list/

Some items are overlapping because the computed size is smaller than the actual one. We can see that the margin-bottom of the PRE element of the ROW 0 overlaps with the ROW 1. We also observe the the space between each ROW varies -- which is not what we expect.

Do you see what I mean?

Screenshot:

Capture d’écran 2020-04-04 à 11 30 09

Mathieu

gnir-work commented 4 years ago

Yes, I will check into it later today. Thanks for the update! My guess is that the calculations are ignoring the margins of the items. For the time being you can try changing from margin to padding 😸

gnir-work commented 4 years ago

If the bug still exists after upgrading to V2.1.0 please reopen this issue :bear:

mathieuleddet commented 4 years ago

Hi !

Thanks for the fix and sorry for the late reply...

Looking at your example online, I still see inconsistencies in the space between the end of the text and the title of the next item. This time there is extra space sometimes.

Capture d’écran 2020-04-08 à 12 11 38

Best regards, Mathieu