App Inventor Beginner Tutorials
Prepare for your exams
Study with the several resources on Docsity
Earn points to download
Earn points by helping other students or get them with a premium plan
Guidelines and tips
Prepare for your exams
Study with the several resources on Docsity
Earn points to download
Earn points by helping other students or get them with a premium plan
Community
Ask the community
Ask the community for help and clear up your study doubts
University Rankings
Discover the best universities in your country according to Docsity users
Free resources
Our save-the-student-ebooks!
Download our free guides on studying techniques, anxiety management strategies, and thesis advice from Docsity tutors
App Inventor Beginner Tutorials: First App with TalkToMe, BallBounce, and DigitalDoodle, Study notes of Applications of Computer Sciences
A series of beginner tutorials for App Inventor, a visual programming language developed by MIT. The tutorials cover creating three simple apps: TalkToMe, a talking app; BallBounce, a simple game app; and DigitalDoodle, a drawing app. The tutorials guide users through setting up an account, creating a new project, connecting App Inventor to a phone, and programming the apps using the Blocks Editor. Users will learn how to use components like TextToSpeech, AccelerometerSensor, and Canvas, as well as how to handle events like button clicks and accelerometer shakes.
What you will learn
- How do I set up a new project in App Inventor?
- How do I program the user interface and functionalities in App Inventor?
- How do I connect my phone to App Inventor for live testing?
- What blocks do I need to use to make a ball bounce in App Inventor?
- What components do I need to use to create a talking app in App Inventor?
Typology: Study notes
2021/2022
1 / 54
This page cannot be seen from the preview
Don't miss anything!
Partial preview of the text
Download App Inventor Beginner Tutorials: First App with TalkToMe, BallBounce, and DigitalDoodle and more Study notes Applications of Computer Sciences in PDF only on Docsity!
App Inventor Beginner Tutorials
1 Four Simple Tutorials for Getting Started with App Inventor
- 1.1 TalkToMe: Your first App Inventor app
- 1.2 TalkToMe Part 2: Shaking and User Input
- 1.3 BallBounce: A simple game app
- 1.4 DigitalDoodle: Drawing App
TalkToMe: Your first App Inventor app
This step-by-step picture tutorial will guide you through making a talking app.
To get started, go to App Inventor on the web.
Go directly to ai2.appinventor.mit.edu , or click the orange "Create" button from the App Inventor website.
Log in to App Inventor with a gmail (or google) user name and password.
Use an existing gmail account or school-based google account to log in to ai2.appinventor.mit.edu To set up a brand new gmail account, go to accounts.google.com/SignUp
Start a new project.
Name the project "TalkToMe" (no spaces!)
Type in the project name (underscores are allowed, spaces are not) and click OK.
You are now in the Designer, where you lay out the "user interface" of your app.
The Design Window, or simply "Designer" is where you lay out the look and feel of your app, and specify what functionalities it should have. You choose things for the user interface things like Buttons, Images, and Text boxes, and functionalities like Text-to-Speech, Sensors, and GPS.
Add a Button
Our project needs a button. Click and hold on the word "Button" in the palette. Drag your mouse over to the Viewer. Drop the button and a new button will appear on the Viewer.
Get the MIT AI2 Companion from the Play Store and install it on your phone or
tablet.
The preferred method for getting the AI2 Companion App is to download the app from the Play Store by searching for "MIT AI2 Companion".
To download the AI2 Companion App to your device directly (SKIP THIS STEP IF
YOU already got the app from Play Store)
If for some reason you can not connect to the Google Play store, you can download the AI2 Companion as described here.
First, you will need to go into your phone's settings (#1), choose "Security", then scroll down to allow "Unknown Sources", which allows apps that are not from the Play Store to be installed on the phone.
Second, do one of the following: A) Scan the QR code above (#2) or B) Click the "Need help finding..." link and you'll be taken to the download page. From there you can download the MITAI2Companion.apk file to your computer and then move it over to your device to install it.
Get the Connection Code from App Inventor and scan or type it into your
Companion app
On the Connect menu, choose "AI Companion". You can connect by: 1 - Scanning the QR code by clicking "Scan QR code" (#1). or 2 - Typing the code into the text window and click "Connect with code" (#2).
See your app on the connected device
You will know that your connection is successful when you see your app on the connected device. So far our app only has a button, so that is what you will see. As you add more to the project, you will see your app change on your phone.
Add a Text-to-Speech component to your app
Go to the Media drawer and drag out a TextToSpeech component. Drop it onto the Viewer. Notice that it drops down under "Non-visible components" because it is not something that will show up on the app's user interface. It's more like a tool that is available to the app.
Switch over to the Blocks Editor
It's time to tell your app what to do! Click "Blocks" to move over to the Blocks Editor. Think of the Designer and Blocks buttons like tabs -- you use them to move back and forth between the two areas of App Inventor.
Make a button click event
Click on the Button1 drawer. Click and hold the when Button1.Click do block. Drag it over to the workspace and drop it there. This is the block that will handle what happens when the button on your app is clicked. It is called an "Event Handler".
Program the TextToSpeech action
Click on the TextToSpeech drawer. Click and hold the call TextToSpeech1.Speak block. Drag it over to the workspace and drop it there. This is the block that will make the phone speak. Because it is inside the Button.Click, it will run when the button on your app is clicked.