← Back to team overview

ubuntu-phone team mailing list archive

POC: Recycling ListView items

 

Hi!

While working on a pet project[1] for the Phone, an issue that I faced was
stuttering scrolling in listviews. QML tips page[2] suggested to use
Flickable+Column+Repeater combination to have smooth scrolling, that worked
and is currently what I have implemented in my app but I always thought
that was not the perfect solution.

With some knowledge of how Android ListView works and its mechanism of
recycling ListView items, I wrote a hack[3] to achieve something similar in
QML.

What I am doing is:

   - Create elements visible on screen at single instance + 2
   - Set contentHeight to number of elements*each element height
   - On flick upwards, when an element goes offscreen, set its Y property
   to the bottom of the list.
   - Not handled the down flick case just yet.

So with only a few elements created, we can reuse same elements but with
different data. I am not sure if there already exists some standard
component for that or not. If not, then this idea is open for discussions
and I would like to contribute it as a standard component once we figure
out all the details and agree on them.

Thanks!


[1] https://launchpad.net/ubuntu-soundcloud-app
[2]
https://wiki.qt.io/Performance_tip_QML_other#Fixed_length_lists_with_Flickable.2BColumn.2BRepeater
[3]
http://bazaar.launchpad.net/~om26er/+junk/recycle_list_view/view/head:/RecycleListView/Main.qml

Follow ups