Photo by astanush - Creative Commons Attribution-NonCommercial-ShareAlike License https://www.flickr.com/photos/27965998@N00

Program Android Apps!with MIT App Inventor 2

Presents…

MIT App Inventor 2:http://ai2.appinventor.mit.edu/

Add components from palette

Adjust properties of components

Drag and drop items into the blocks editor, and snap blocks together

Now let’s create an app!

First, start a new project

Add a label to the screen(a label item shows up in the Components area)

Add a button to the screen

Select the Label1 component, and click on Rename.

Rename Label1 to lblMessage and Button1 to btnEnter

With lblMessage selected, Change BackgroundColor to Cyan

Change FontSize to 30

Change Height to 50 pixels

Change Width to Fill parent, and clear ‘Text for Label 1’ under Text

With btnEnter selected, change FontSize to 30

Change Height to 50 pixels

Change Width to Fill parent

Change Text to ‘Click here’

In the Blocks editor, select btnEnter

Drag when btnEnter.click to the blank canvas

Select lblMessage, and drag set lblMessage.Text over to the canvas

Connect the blocks together

Under the Built-in blocks, select Text, and drag the empty string “ ” block over to the canvas

Snap the blocks together, and change the empty string to “Hello world!”

Let’s test it out!

Download the MIT AI2 Companion on your mobile phone

On the upper right-hand side, click on Connect and AI Companion

Launch the MIT AI2 Companion on your mobile phone, and enter the QR Code to see the project in action

No Android device? No problem!

Download the App Inventor Setup Package:

http://appinventor.mit.edu/explore/ai2/mac.html

Click on Connect and then Emulator

Let the Android Emulator load for a few minutes

Click on the MIT AI2 Companion app on the phone(you may need to connect again to load the project)

Viola! When the button is clicked, ‘Hello world!’ appears.

Save the project as an .apk file, and open it up on your Android device

to launch the app

Congratulations! You’ve successfully created an Android app.

Questions?

Thank you!

“Like” us on Facebook!:www.bit.ly/jypathways

Follow us on Twitter: @jypathwayswww.jypathways.org