4 – User Input

• Apply decomposition to break down a larger problem into more manageable steps
• Use user input in a block-based programming language
• Use a block-based programming language to create a sequence
• Use variables in a block-based programming language

• Event-driven programming
• event handler
• input

• checkbox
• variables
• sequence

• object properties
• object ids
• decomposition

It is common for software applications to obtain data from the user.

Questions

• What data is being collected?
• How is it being collected?
• At what point does the user submit the data?

Think/pair/share

getText (“id”) is a built-in subroutine that collects the text entered into a textbox; “id” is to be replaced with the name given to the text box.

You can use an event handler to determine when to collect the data and what to do with it once it has been collected and linked with a variable.

Click here for an example app that uses this feature.

The purpose of this app is to allow the user to enter in the number of adult and child tickets required.

Once the user selects the submit_button, the data will be captured and processed and total will be displayed in the result_label.

Download the worksheet below and place the blocks in the correct order to form a working segment of code.

Download Activity 1 WORKSHEET

Decomposition is breaking a problem down into more manageable chunks.

Programming an app for a mobile device can be a daunting task to undertake.

Decomposing the problem helps us make the task less daunting and more achievable.

Step	Further decomposition
Screens	1. Create three empty screens to work with and give each an appropriate name.
Welcome screen	1. Design the welcome screen by adding images, labels, and buttons. 2. Code button so that when clicked it moves to the game screen.
Game play	1. Add title label and blue dot image. 2. Code blue dot to move to random position on screen when clicked. 3. Add score variable that increments 4. Code screen to move automatically to the results screen after five seconds.
Results screen	1. Add score label. 2. Add code to pass the score into the score label. 3. Add play again button and code it to go to the welcome screen.

Open your project diary and spend ten minutes decomposing your app project with your partner.

Now that you have decomposed the problem and have designs for the screens, you are ready to start developing your app.

• Sign in to code.org with your credentials (username and password)
• Select Projects and click on the App Lab
• Name your project with the same name as the app title

While you are developing your project, you and your partner will take turns to be the driver and the navigator. You will swap roles regularly as directed by your teacher.

The driver: Your role is to control the keyboard and mouse and place the code block in the correct places.

The navigator: Your role is to help support the driver by watching for any mistakes, reading the instructions to the driver, or seeking support if needed.

How to be successful with pair programming:

• Teamwork
• Driver: focus on the code and workspace
• Navigator: watch the code being entered by the driver, look at previous work and examples, and research the problem

Both partners must be contributing equally.

You should now spend the rest of the lesson working in your pairs on your app, leave 5 minutes at the end to do the next task.

In your pairs, you now need to reflect on what you have achieved this lesson. Open your project diaries and navigate to the slide “Diary Milestone 1”.

1. Add a screenshot of your code or design window.
2. Describe what you have achieved this lesson and any problems you had to overcome.
3. Write down what you need to focus your attention on in the next lesson.

In this lesson, you…

• Looked at how to handle user input from a text box
• Decomposed your project
• Make a start developing your project

Next lesson, you will…

• Develop your app further

• Complete Activity 1 – Theme park tickets app and upload the Word document to www.bournetolearn.com.

• Complete Your project diary: Milestone 1 and upload a screenshot of the page to www.bournetolearn.com.

• Complete Your project diary: Milestone 1 with evidence of high progress to www.bournetolearn.com.