Download - App Inventor - WordPress.comApp Inventor •We are going to improve our first app by adding Text To Speech. •This app has a button that when pressed the text on the button will change

Transcript
Page 1: App Inventor - WordPress.comApp Inventor •We are going to improve our first app by adding Text To Speech. •This app has a button that when pressed the text on the button will change

App Inventor

• We are going to improve our first app by adding Text To Speech.

• This app has a button that when pressed the text on the button will change and the phone will speak.

Page 2: App Inventor - WordPress.comApp Inventor •We are going to improve our first app by adding Text To Speech. •This app has a button that when pressed the text on the button will change

App Inventor – Step 1

Click the Media Palette, select the “TextToSpeech” component.

Page 3: App Inventor - WordPress.comApp Inventor •We are going to improve our first app by adding Text To Speech. •This app has a button that when pressed the text on the button will change

App Inventor – Step 2

Drag and drop the “TextToSpeech” component onto the App Inventor Screen.

Page 4: App Inventor - WordPress.comApp Inventor •We are going to improve our first app by adding Text To Speech. •This app has a button that when pressed the text on the button will change

App Inventor – Step 3

The “TextToSpeech” component does not appear on the screen. It is a hidden component. Rename to ttsClickMe.

Page 5: App Inventor - WordPress.comApp Inventor •We are going to improve our first app by adding Text To Speech. •This app has a button that when pressed the text on the button will change

App Inventor – Step 4

Click the Blocks button to open the script editor.

Page 6: App Inventor - WordPress.comApp Inventor •We are going to improve our first app by adding Text To Speech. •This app has a button that when pressed the text on the button will change

App Inventor – Step 5

Click the TextToSpeech Block. Select the “call ttsClickMe.Speak message” script from the pop out.

Page 7: App Inventor - WordPress.comApp Inventor •We are going to improve our first app by adding Text To Speech. •This app has a button that when pressed the text on the button will change

App Inventor – Step 6

In the Built In Blocks select the Text Block. Type in the text you want to hear.

Page 8: App Inventor - WordPress.comApp Inventor •We are going to improve our first app by adding Text To Speech. •This app has a button that when pressed the text on the button will change

App Inventor – Step 7

Drag and drop the “call ttsClickMe.Speak message” into the “when btnClickMe.Click do” block.

Page 9: App Inventor - WordPress.comApp Inventor •We are going to improve our first app by adding Text To Speech. •This app has a button that when pressed the text on the button will change

App Inventor – Step 8

Click Connect, Emulator to launch the Emulator.

Page 10: App Inventor - WordPress.comApp Inventor •We are going to improve our first app by adding Text To Speech. •This app has a button that when pressed the text on the button will change

App Inventor – Step 9

Or click Connect, AI Companion to launch the app on an Android mobile device.

Page 11: App Inventor - WordPress.comApp Inventor •We are going to improve our first app by adding Text To Speech. •This app has a button that when pressed the text on the button will change

App Inventor

• We are going to improve our first app more by adding an acceleromoeter.

• When the phone is shaken the the phone will speak.

Page 12: App Inventor - WordPress.comApp Inventor •We are going to improve our first app by adding Text To Speech. •This app has a button that when pressed the text on the button will change

App Inventor – Step 10

Click the Sensors Palette, select the “AccelerometerSensor” component.

Page 13: App Inventor - WordPress.comApp Inventor •We are going to improve our first app by adding Text To Speech. •This app has a button that when pressed the text on the button will change

App Inventor – Step 11

Drag and drop the “AcceleratorSensor” component onto the App Inventor Screen.

Page 14: App Inventor - WordPress.comApp Inventor •We are going to improve our first app by adding Text To Speech. •This app has a button that when pressed the text on the button will change

App Inventor – Step 12

Rename the “AccelerometerSensor” to “accClickMe”.

Page 15: App Inventor - WordPress.comApp Inventor •We are going to improve our first app by adding Text To Speech. •This app has a button that when pressed the text on the button will change

App Inventor – Step 13

Click the accClickMe Block. Select the “when accClickMe.Shaking do” script from the pop out.

Page 16: App Inventor - WordPress.comApp Inventor •We are going to improve our first app by adding Text To Speech. •This app has a button that when pressed the text on the button will change

App Inventor – Step 14

In the “when accClickMe.Shaking do” script duplicate the “call ttcClickMe.Speak message” script.

Page 17: App Inventor - WordPress.comApp Inventor •We are going to improve our first app by adding Text To Speech. •This app has a button that when pressed the text on the button will change

App Inventor – Step 15

Type the text you want to hear when the phone is shaken.

Page 18: App Inventor - WordPress.comApp Inventor •We are going to improve our first app by adding Text To Speech. •This app has a button that when pressed the text on the button will change

App Inventor – Step 16

Click Connect, Emulator to launch the Emulator.

Page 19: App Inventor - WordPress.comApp Inventor •We are going to improve our first app by adding Text To Speech. •This app has a button that when pressed the text on the button will change

App Inventor – Step 17

Or click Connect, AI Companion to launch the app on an Android mobile device.