Thunkable: Coding Conditionals

  • Learn about conditional statements and how to write them
  • Practice writing conditional blocks with a simple app

These are the activities for this lesson:

CONDITIONS

Mobile apps don’t run exactly the same way every time you open it. It runs based on your interactions as a user, which are not always exactly the same.

We have already learned about event handlers, and how they trigger certain blocks of code to run when events happen.

In addition to event handlers, there are other ways that apps decide what particular blocks of code to run, and when. These are called conditions. And the blocks associated with conditions are called conditional blocks.

man at fork in the road

Best practices: There is a fun programming joke you can use to illustrate how confusing conditionals are: My wife said: “Please go to the store and buy a carton of milk and if they have eggs, get six.” I came back with 6 cartons of milk. She said, “Why did you buy six cartons of milk?!?!” 

It’s a fun brain teaser and it shows how dumb computers are sometimes. The first column of code on the left is what happens based on the ask, I buy 6 cartons of milk. The second column of code on the right is what should happen, where I end up buying 6 eggs.


I bought 6 cartons of milk, because she said “buy milk and if there are eggs, get six.” Her ask actually reads as “buy milk and if there are eggs in the store, buy six cartons of milk.” She needs to specify “six eggs.” 

This is how computers work, they will only work with the information you give them, so make sure it’s specific.

Guiding Questions to ask students: What are some of the conditionals on your favourite apps? (ex: if you are logged in to tiktok the fyp pulls from your list otherwise it is random, If the user has dark mode enabled, turn everything to black)

Mentor tips are provided by support from AmeriCorps.

stylized A, AmeriCorps logo in navy

EXAMPLE

girl holding umbrella in the rain

A real life example of a condition is the weather.

You make decisions based on that condition.

If it is raining, you use an umbrella.

The condition is “raining”.

  1. You determine if that condition is true or false, by checking a weather app or looking out the window.
  2. You then take action based on the condition.
    1. If it’s raining, you take your umbrella.
    2. Otherwise, you skip it and go out the door.

You make all sorts of decisions based on conditions around you. Mobile apps also make decisions based on conditions within the app. For example, if the user inputs a wrong password, the app displays a message telling the user so and prevents them from going further in the app.

Conditionals are fundamental to all programming languages, including Thunkable.

The structure of a conditional block in Thunkable is

if condition do

Conditional blocks can be found in the Control drawer of the Blocks Editor.

thunkable conditional blocks

Here is how these blocks work.

Thunkable conditional blocks

The condition snaps
to the if.

If the condition is true,
the code in the do slot runs.

With if/else blocks, if the condition is true, the code in the do slot runs.

If the condition is false, the code in the else slot runs.

If the condition is false, the code is skipped and nothing happens, or the code continues to run after the if block.

You can change your conditional blocks by clicking the blue gear icon.

Then drag more else if or else blocks in.

The else if block allows you to test for multiple conditions in one block.

thunkable conditional example block
if else block
if else-if else block

If it’s raining,
     use umbrella.

One condition, one option. Otherwise, do nothing.

If the temp is greater than 22C, 
   then open window
else close window.

One condition, but two options.
One for true, one for false.

If the temp is greater than 22C
     then open window
else check if temp is less than 7C 
    If so, turn on heat
else, just close the window. 

Two conditions checked,
but 3 options.

IMPORTANT! The order in which you test multiple conditions does matter. Once a condition is found to be true, it executes that code and skips over the rest.

So, in the third example, if the temp is greater than 22, it opens the window and doesn’t check the second if block.

LET'S TRY A CODING EXAMPLE

The Counting Game is a simple app where you (and possibly an opponent) keep adding numbers to a running total, and try to hit 100 exactly. If you go over, you lose.

ACTIVITY: COUNTING GAME

Estimated time: 20 minutes

Complete the Counting Game using Conditionals

Open the starter project in Thunkable and make your own copy by pressing the "click to remix" button.

Then follow the instructions in the worksheet to complete the app!
Open worksheet

Hopefully you have successfully coded the Counting Game using conditional blocks!

If you wish to see a possible solution, click this button.

solutions for checktotal function

CHALLENGE

Add a Reset button to the app.

The Reset button should set the total back to zero so the user can play again.

REFLECTION

Can you think of conditionals that you use to make decisions every day? Here are some examples:

post with different directions to go
If it is cold outside, then wear a jacket.
If your phone is dead, then charge it.
If you are sick, then go to the doctor, else go to school.
If your clothes are dirty, then wash them, else put them away in your closet.

REVIEW OF KEY TERMS

  • Conditions –  a state or situation something is experiencing
  • Conditionals statements or blocks –  a way for computers to make decisions based on conditions
  • if/else – a common form of conditional statements in programming; tells the computer that if the condition is true, do this. Else, if the condition is false, do another thing

ADDITIONAL RESOURCES

If you want a little more practice, this video covers conditionals in Thunkable in another simple app.