Nominate our 2022 Qt Champions!

Problem: Scrolling ListView with many entries of different height.

  • Hi,

    I've the problem that hat already be discussed here (, but was never solved properly.

    I have a ScrollView which scrolls a ListView that uses TextEdit as delegate items. I use it to show console/chat output that is about to grow very large (several 1000 entries).
    Just using TextEdit doesn't work as it tents to crash with some hundred lines of content. And it is already very very slow before this point.
    So the idea was to break the output into smaller parts and show them in a ListView which should automatically load only the text currently visible. Still using TextEdit to be able to have a selection of text (multi TextEdit selection worked, after some time :)).

    All this works fine until it comes to scrolling the ListView.
    As it was described in the other thread ( the ListView tries to calculate the contentHeight using the currently shown delegates. I tracked the estimation and found that it is off by more than 30% at some points, which makes scrolling quit impossible.

    I tried using the sizeHintRoll of my data model to avoid the calculation of the height of each delegate within QML, but ListViews do not use the sizeHint by default so I only was able to set the delegate height which didn't change any scrolling problems.

    Next idea was to calculate the contentHeight on the C++ side and hand it over to the ListView but still it recalculates the contentHeight as soon as I start scrolling.
    Moving the scroll bar handle jumps to quit unpredictable positions. Boarder cases like top, bottom, middle are kind of ok but the handle tends to jup around a lot while dragging.
    Using the mouse wheel when the scroll bar is on the bottom often leads to jumping around in the list for some 10-300 entries instead of just scrolling up one bye one.

    Can anyone give me advice how to handle this issue.
    I would also be happy to have another solution than ListView+TextEdit for showing console/chat output.
    Or is there any possibility to disable the automatic recalculating of the contentHeight?

    Thank you for any advice.

  • Well I found a solution. I post here so maybe it helps somebody.

    1. You need to declare a global property which stores the height. For example : reViewHeight

    2. Put the ListView inside a transparent Rectangle: rcView, and put the rectangle inside the ScrollView

    3. Add: Component.onCompleted: { reViewHeight = reViewHeight + height} in your delegate definition

    4. In the ListView add: onCountChanged: { rcView.height = reViewHeight }

    Done !