Step 1

This is a great app but let’s make it even better by adding a text box so that the app will say anything the user types!

Go back to the Designer editor. From the User Interface palette, drag and drop the TextBox component onto the Viewer. Put it above the Button on the screen. 

In the Properties pane, change the Hint for the text box to “Type your message here”.

Step 2

Go to the Blocks editor. You want your app to speak out loud whatever is typed into the text box. This is stored in the TextBox1 Text property. To do this, we need to “get” the text from the text box. 

From the Blocks palette, click the TextBox drawer to open it. In this drawer you will find event handler blocks (yellow), command blocks (purple) and a series of green blocks if you scroll down. Green blocks are the “getters” and “setters” of the TextBox property. 

Step 3

• Drag out the TextBox1.Text block onto the Viewer
• Pull out the pink text block from when Button1.Click and drag it to the bin in the bottom right corner of the screen to discard it
• Plug TextBox1.Text into the empty slot

Step 4

Test your app! 

Now your app has two behaviours: 

• When the button is clicked, it will speak out loud whatever words are currently in the text box on the screen (If nothing is there, it will say nothing.)
• The app will also say a different phrase when the phone is shaken