App Inventor: Lesson 1
Do you ever wish you could call upon the woof of a puppy, meow of a kitten, or roar of a T-Rex, on a moments notice? If so you will enjoy this first lesson where we will make an app that has a button that when pressed produces the sound of a dog, cat, or T-Rex. Personally, I love dinosaurs so I will be creating the T-Rex version.
Before we begin you will need to download one of the three pictures below and one of the three sounds below. Mixing and matching the sounds and pictures is encouraged.
Parts of the Page
- The Palette has all the widgets that can be added to our app
- The viewer is were we add the widgets and view our app
- The components shows all the widgets we have added
- Properties lets us manipulate the widgets
Step 1: The Button
Drag the from the tab under the
Step Two: Uploading the Image
- Under click on “Button1”
- In under “Image” click on the bubble that says “None…”
- Then click on “Upload File…”
- Click on “Choose File” and select the picture that you have chosen for your app (Dog, cat, or T-Rex). Then press “OK”
- Scroll down the Properties category and find the “Text” Header
- Click on the white box below the header
- Delete the text “Text for Button 1”
- Under find the
- Click on the white bubble underneath “Height”
- Click “Fill Parent” this will fill whatever screen you test your app on.
- Press “OK”
- Underneath the click on the and drag the on to the button with your dog/cat/T-Rex.
- On the other side of the screen click on the under the tab. Then underneath the Source title click on the white bubble that says “None…” Use the same process you used to import the image instead import the sound file you downloaded.
- At the top right-hand corner find the “Blocks” button and click on it.
- On the left side of the Blocks Editor, click the Button1 drawer to open it.
Those mustard yellow blocks are called event handler blocks.
- Grab the and drag it on to the code table (the gray area under the “Viewer”)
- Then go to the tab and grab the and put it inside of the . This will make the phone play the sound you have chosen when you press the button.
Final Code Block:
Use the links below to test your app using your phone or an emulator on your phone.