In my last blog post I described how you can use timers to create a looping condition, and in my example the use-case was building a single collection from multiple pages of results from an API call where an array is returned.
In this post, I’m going to sort of do the opposite: Split a large collection into multiple pages so a fixed number of rows can be displayed in a gallery with a timer being used to switch through the pages. The application for this would be a wall board, much like an airport arrival or departure board where the entire list doesn’t fit on the screen and it’s not practical to scroll.
I’m going to use the exact same app and data source as in my last blog; a collection of nearly 1000 items.
In the screen shot below, you can see the formula in the Items property of the selected Gallery. What this is doing is taking the first 8 items of the last N items of the whole collection, where N is the number of rows in the collection minus the value in TextInput2.Text multiplied by 8. As you can see, that text input box represents the page number. With TextInput2.Text set to 0, the value of N is number of rows in the whole collection, so the gallery shows the first 8 of them.
I can keep typing numbers into there until I find the last page:
There are 114 pages of items, when the whole collection is divided into pages of 8 items, with page 114 only containing the last 4 items.
Next, we need to be able to scroll through these and return to page 0 when we reach the end, bearing in mind the number of records in the collection, and therefore the number of pages, can change when the collection is cleared and collected, i.e. on app start.
At this point we add a Timer control to the screen. Set its duration to be as long as you want to display a single page for, Maybe 10 or 20 seconds, depending on how much information the reader will need to take in. The timer is set with AutoStart true, and Repeat true, because we want it to start automatically and constantly repeat. You could have AutoStart false and start it when the Collect() function finishes on app start, if that’s what you’re doing.
Here is the OnTimerEnd property of the timer.
Before I explain this formula, it’s necessary to point out there’s a variable being introduced here, con_scrollPage; being set by the true value and false value of the If().
That context variable is being used by the Default property of TextInput2, which in turn, is fed into the Items property of the gallery.
You don’t have to use this intermediary text input box to do all this, you can simply use the variable directly in all the expressions where TextInput2.Text is: In the If() within OnTimerEnd and likewise the LastN section of the formula in the Items property of the gallery.
So back to the OnTimerEnd formula: We have a very similar formula here as the Items property of the gallery, but instead of outputting a table, we’re counting the rows and evaluating the result against > 0, and instead of counting the rows in the current page (TextInput2.Text) we’re evaluating the next page (TextInput2.Text + 1).
So, if the next page than the one currently being displayed has more than 0 rows, then increment the page number by 1 (show the next page) and if the next page has 0 rows, then reset the page number to 0.
This timer, when running on a continuous loop, will always go back to page 0 after displaying each page in turn.
In this video you can see it working. As the collection grows, the number of pages increases. I set my timer interval to 100ms so I don’t bore you to death.
Apologies for not embedding the video, it’s not possible under the free plan WordPress.