You’ll often want to show the data from a spreadsheet in reverse order– the bottom row of the spreadsheet showing up on top in the app, as when you want to show the most recent user post first.
Unfortunately, as of July 2021, Thunkable’s Data Viewer List and Data Viewer Table components only allow data to be displayed in the same order as in the spreadsheet.
There is a work-around, and its the same process you’ll use if you want to filter data and show only some of the rows. The short answer: create a second table and manually copy the data, in reverse order, from the Google sheet into that second table.
These are the steps:
- Create a second data source, one that uses Thunkable’s built-in tables. Provide that table with the same column heading as in the original Google sheet, or a subset of them. The table should only have a header row, and shouldn’t be initialized with any data rows.
- Map your Data Viewer List or Data Viewer Grid component to this second data source.
- In the “when Screen.Opens” event handler, retrieve the data from the Google sheet into list variables, one for each column of data. Then loop through those lists, in reverse order, grab each element, and place the data into the second data source.
- Use visibility and a loading icon to hide the backend work from the user.
Check out this sample Thunkable app, which displays some Oscar Award data into a Data List Viewer in reverse order. Here are the blocks:
The code first deletes all the rows in FilteredOscars, which is the second data source that holds the data in reverse order.
Then the code uses the “list of values in” blocks to retrieve the data from the original sheet (ForeignFilms), placing that data into list variables.
The code then loops through the lists in reverse order. The “count with” block goes from “length of app variable idList” to 1, subtracting 1 each time. On each iteration, a new row is added to the second data source.
Similar code could be used to filter the data, e.g., show only spanish language films. For filtering, you’ll place an if block within the loop, and only add new rows in the second data source for the rows of the original spreadsheet that meet the criteria.