Slow/jittery performance with ListBox scroll on iOS

adamski · April 7, 2016, 6:24am

I'm getting really slow & jittery performance on an iPhone 3 running iOS 7.1 with a scrolling ListBox.

Its using a custom row component. I've tried using setOpaque(true) on the row component and its children, but that does not seem to have made any difference in performance. I'm also using OpenGL.

Anything I should look at to get smooth scrolling performance on iOS?

dave96 · April 7, 2016, 7:27am

You have to use a profiler for stuff like this. iOS is a very different beast to OS X/Win so the bottlenecks could be in different places.

I found it was best to use a native list box on iOS. It gave far the best peformance and feel.

adamski · April 7, 2016, 7:27am

Thanks. Having some issues with the Xcode instruments rebooting the device whenever I try and run the profiler. I tested with a basic listbox in a new project and the performance is fine, so its probably something to do with my code. I'm also struggling with incredibly long build times for release builds - up to about 10 mins at a time spent on the linking stage.

I'll have a look at using a native listview / UITableListView. In some ways I'd like to use native UI for navigation and list elements as they make smooth transitions and scrolling so much better. For iOS this is not so bad sd we have the UIViewComponent class but for Android this is a whole other kettle of fish and requires a fair bit of restructuring.

Anyhow, I'll report back with my findings when I manage to get the profiler working.

keithw99 · September 27, 2020, 9:28pm

Hi – JUCE noob here coming across the same issue 5 years later. I recently put together my first JUCE GUI prototype that makes heavy use of a large (Table)ListBox, and the scrolling is extremely slow/jittery on iOS exactly as you described. My Mac OS and Linux builds don’t have this problem at all.

I’m guessing that you’re the same person who gave this great presentation:

If so, it sounds like you solved this problem by using iOS-native UI elements and ditching the ListBox altogether…

I was hoping to avoid that route, especially since my iOS build works great otherwise – the only issue is the scrollability of lists. Unfortunately that one issue is crippling for UX since a primary feature of the app is the ability to quickly scroll through long lists of patch names.

So as a last-ditch effort before I dive into the world of iOS development (where I have zero experience), I was hoping to find out two things:

Is there anything I can do in JUCE (tricks, using different classes, etc) that would improve the scrolling performance of a TableListBox in iOS? Have there been any improvements/workarounds since this original post?
If my only UI concern is list-scrolling performance, what is the least-invasive way to fix that with iOS-native code? i.e. could I somehow replace my TableListBox with a native UITableListView but keep the rest of my UI in JUCE?

Thanks,
Keith

dikadk13 · September 30, 2020, 1:40pm

I replaced Juce Viewport with native iOS UIScrollView

Here is gist of my Viewport. You can modify ListBox or TableListBox to use this Viewport and it will work great on iOS.

gist.github.com

https://gist.github.com/dikadk/3e68cd7c7c024a38de54da524613a5e8

ios_viewport.cpp

/*
This file is part of the JUCE library - "Jules’ Utility Class Extensions"
Copyright 2004-11 by Raw Material Software Ltd.

JUCE can be redistributed and/or modified under the terms of the GNU General
Public License (Version 2), as published by the Free Software Foundation.
A copy of the license is included in the JUCE distribution, or can be found
online at www.gnu.org/licenses.

JUCE is distributed in the hope that it will be useful, but WITHOUT ANY

This file has been truncated. show original

ios_viewport.h

#include <JuceHeader.h>


//==============================================================================
/*
A Viewport is used to contain a larger child component, and allows the child
to be automatically scrolled around.

To use a Viewport, just create one and set the component that goes inside it
using the setViewedComponent() method. When the child component changes size,

This file has been truncated. show original

ios_viewport.mm

#include "ios_viewport.h"

#if __OBJC__ && JUCE_IOS

#include <UIKit/UIKit.h>

@interface JuceUIScrollView : UIScrollView<UIScrollViewDelegate>
{
@private
    Viewport* owner;

This file has been truncated. show original

Most important part is in ios_viewport.mm.
Once added to project make sure to specify that ios_viewport.mm is Objective-C++ in Xcode and you added flag “-fno-objc-arc” to compiler schema.

adamski · September 30, 2020, 1:59pm

This a great solution that will work for the use case where you just need scrollable lists.

If you need ViewController screen “push” type behaviour as well, and other “swipeable” UI elements, I would consider switching things around so that you build a native app and pull in JUCE as a library.

keithw99 · October 1, 2020, 1:47am

Thank you both so much! For my case the ios_viewport seems perfect since list scrolling is the only performance issue I’m having, and that class seems to be exactly what I need.

I’ve made a decent effort to keep the logic of my model/view/controller separate so if I decide to convert the UI to native iOS it hopefully won’t be too painful.

Site navigation

Slow/jittery performance with ListBox scroll on iOS

Further Information