#CSinSF CS 2: thunkable

Lesson# 4

Intro to Variables II: Countdown Timer

What you will do in this lesson:

Add the Timer Component to turn your Score Tracker into a Countdown Timer

What you will learn in this lesson:

How to use the Thunkable Timer Component
How to use conditionals to check if a variable is equal to 0
How to use the Text Input Component to get a value for a variable

Vocabulary

Incrementing is adding to a value. You will increment the value of a property when creating your counter app.
Decrementing is subtracting from a value. You will decrement when creating the countdown timer app.

Agenda/Lesson Steps

1. Watch the Intro Video

2. Remix your Score Tracker App

3. Build Countdown App

Slidedeck/MiniLesson

2-4 Intro to Variables II: Countdown Timer

Activity

1. Intro to Countdown Timer

2. Remix your Score Tracker App

On My Projects Page, click the 3 dots on "Score Tracker"
Click Duplicate
Rename your new app "Countdown Timer"

3. Update the User Interface

add 3 new buttons
- Rename and change Text to "Start"
- Rename and change Text to "Pause"
- Rename and change Text to "Reset"
Add a Text Input Component
Add a Timer Component
Add a Text to Speech Component

4. Change the Timer Properties

interval to "1 Second"
Loops --> True
Enabled --> false

5. Program the Buttons

When Start Button Clicked
- set Timer Enabled to True
When Timer Fires
- if app score > 0
  - change score by -1
  - set Counter Label to app score
  - Text to Speech call speak app score
- Else:
  - set Timer Enabled to False
When Pause Button clicked
- set Timer Enabled to False
When Reset Button clicked
- set app score = 0
- set Counter Label to app score

6. Program the Text Input

Under Properties, set Hint to:

"Enter a Starting Number and Click 2x"

When Text Input Clicked
- set app score --> Text Input get Text
- set Counter Label to app score

Handout

2-4 Countdown Timer

Closeout

Universal Supports

Report abuse