Create multiple "Categories" in your app with just 1 Screen

Tutorials and DIY Guides
1

In this tutorial we will look at how to dynamically add content to a screen in Thunkable.

Take a look at the template here: Thunkable

Intro

This app looks like it might have 6 screens, but in reality it has only 2. There is 1 screen for the menu and then 1 “template” screen that we dynamically update depending on what button is pressed.

Screenshot 2020-10-19 at 19.03.40
Screenshot 2020-10-19 at 19.03.40486×648 10.7 KB

Design

In this app all the settings are defined in the blocks. This is really useful if you want to resize several components all at once (but duplicating components is still probably the fastest way)

Screen1 acts like the “Menu” with 5 options displayed on screen. Rather than having each button link to a single screen, all the buttons actually open Screen2. The blocks on Screen1 detect which button was pressed and change the appearance of Screen2 based on the users selection.

Remix this App for Yourself

https://x.thunkable.com/projectPage/5f848c54bd53ef6e45c4bf89

3 Likes
2

nice work @domhnallohanlon this concept can be applied to user roles as well.

instead of a button press, the signal to the app to display different content can be triggered by some input value such as a key given to ‘admins’ they include during app registration!

1 Like
3

BUT IT CAN ALSO BE DONE USING STORED VARIBLES
EZZ
:upside_down_face:

4

This is a really nice and succinct example of how to use the Any Component blocks. And even though it’s done with list data, it could just as well be done with spreadsheet data.

I built a student directory/yearbook app this way by arranging a grid of thumbnail photos from AirTable, populating the images and names from the spreadsheet, and then having a second screen that appeared when the user tapped on an individual student. The second screen showed a larger photo and details about the student.

3 Likes