Details
-
Bug
-
Resolution: Unresolved
-
P2: Important
-
None
-
5.15.17, 6.7.1
Description
Reproducer attached. The problem is caused by
verticalLayoutDirection: ListView.BottomToTop
which seems to have completely different content management than normal top-bottom layout.
Run the reproducer and click the "+" button of bottommost (or "topmost" since ListView is arranged reversely) "Apple" item. One can see that all items are pushed all the way up and out of viewport. And the output to console is:
qml: contentHeight: 1570 qml: contentY: -600 qml: contentHeight: 1270 qml: contentHeight: 5020 ->This is weird. Clicking button increases height of only 1 item (Apple) by 2000. But contentHeight becomes 5020?
Then one has to scroll up to bring content back to viewport. Upon one can see the giant red Rectangle of "Apple", contentHeight blows up to 31270. This is somewhat expected since (80+2000)*15+5*14=31270, i.e. ListView thinks that all 15 items are expanded to height of 2080 (and 14 spacers remain the same). And actually, the normal top-bottom ListView (can confirm by commenting out "verticalLayoutDirection: ListView.BottomToTop") also reports a contentHeight of 31270 if one clicks the topmost "Apple". But somehow, the same behavior does not push items out of viewport for top-bottom ListView. So I suppose the main issue is on contentY (top-bottom ListView do not need to update contentY on item expansion) instead of contentHeight (see workarounds below).
One way to work around the content position problem for bottom-top ListView is to give it a large enough cacheBuffer. Uncomment
cacheBuffer: 2000
on line 41, and one can see that items still remain in viewport. And output to console goes:
qml: contentHeight: 1570
qml: contentY: -600
qml: contentHeight: 1270
qml: contentY: -2600 -> This change in contentY makes a difference. Items are brought back into viewport
qml: contentHeight: 31270 -> This confirms with the "correct" contentHeight when items are visible
But this workaround may not be a good one. In actual product, a too-large cacheBuffer may cause other issues. And determining a "large enough" value is somewhat a guess work.
Nevertheless, another supposedly workaround does not work as expected. Uncomment
listView.contentY -= 2000
on line 71, and one can see that items are, still, within viewport, but contentY somehow jumps. Output to console is:
qml: contentHeight: 1570 qml: contentY: -600 qml: contentHeight: 1270 qml: contentY: -2600 -> contentY is correctly adjusted, good qml: contentY: -1270 -> Where is that value come from?
Again, all those weird behaviors are only reproducible with bottom-top ListView. The conventional top-bottom ListView is all good. Something must be wrong within the implementation of
verticalLayoutDirection: ListView.BottomToTop