Creating a Toggle in Thunkable

You can create an on/off switch, also known as a toggle switch, in your app with a variety of different components and blocks in Thunkable X.

Switch

The switch component is probably the easiest to get started with.

When the switch is clicked, the value changes. The newValue variable is either true or false, depending on whether the switch is on or off.

In this example, a label is used to display the words “On” or “Off” depending on the position of the string.

05

Click to remix the “Toggl” app

1 Like

Button

You can also combine buttons and variables to create a simple toggle like so:

25

In this example, in addition to changing the text on the button we also chance the value of the variable and the text colour in the button.

Click to remix the “Toggl” app

1 Like

If you want an option that doesn’t use variables then you can simply use the text on the button to detect the current position of the button.

44

If you combined this approach with some “else if” conditions then you can easily create a switch with several different positions.

Click to remix the “Toggl” app

2 Likes

Expanding on the previous idea, you can toggle the background image of a component by doing something like this:

22

Click to remix the “Toggl” app

1 Like

Creating a Resetting Switch

Something like a “normally closed” switch, in this example we’ll make a button that defaults to “off” or that can reset itself after a predetermined amount of time.

The blocks below will work for any number of switches:

Demo

Preview for yourself here:
https://thunk.app/w/KBKpW3y5Y

2 Likes

This is really cool! In my flight tracker app, because the api data is not free, i went with a switch to tell the app when to get and not get data instead of an on/off switch for styling purposes but I like this better…

It could show a countdown for my purpose and every time it is pressed get reset to the predefined interval. something could always stay on as long as there was user interaction.

This could be used for cool basic behavior analysis experiments like teaching an animal to press a button for food but also to learn to wait a predetermined amount of time to do so.

I’m considering purchasing an arduino kit to teach my dog to press a button so that some device delivers part of a dog treat. Then i want to graph her behavior and see if it matches behavior of other animals that have been researched and published like rats and pigeons.

2 Likes

Thanks!

Done :smile:

wait

:eyes: Preview:

:recycle: Remix:
https://x.thunkable.com/copy/2288140492282fc7e610c32b3d2b6bde

2 Likes

This is a great example!

Thanks @domhnallohanlon

2 Likes

Where to find this block:
from Button1 get Text

Seems missing now in the new version of Thunkable

@jorax.db11k3t This is a thread from over 4 years ago now. Be sure to check out our posts about How to ask Great Questions v2.0 and our Community Guidelines to see about replying to old posts vs starting a new one.

The Thunkable platform used at the time was our Snap to Place project editor. We have since updated our main editor to be our new(er) Drag and Drop project editor. The new button block is shown here.