Menu Close

MIT App Inventor – Introduction

This tutorial of Robo India explains how to use MIT App Inventor to develop any android based application.

1. Introduction:

App Inventor is a cloud-based tool, by which you can build android applications using web browser. This website offers all the support you’ll need to learn how to build your own apps.

Go to the: http://appinventor.mit.edu/explore/#

By clicking on the orange “Create Apps!” button from any page on this website you can get mit app login page or you can go directly from ai2.appinventor.mit.edu.

Log In to App Inventor using an existing gmail account.

Click on continue to dismiss the splash screen.

To start making your application, click on the Projects menu on the top left of the screen and select the “Start new project” and then give the name of your project.

Note: Your project name does not contain any Space. You can use underscore.

2. Designer Panel:

Now, you are in the designer panel of your project, where you can layout the “user interfaces” of your app. You choose things for the user interface things like Buttons,Images, Text boxes to the palette.

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. You can change the properties of the components like height, width, text, color to the properties panel.

3. Live Testing:

You can test your app while you are building it. For this you need MIT AI2 Companion to connect your android phone or tablet.

The method for getting the AI2 Companion App is to download the app from the Play Store by searching for “MIT AI2 Companion” and install it on your phone.

To get code from App Inventor, click on the “Connect” button and select Al Companion.

After installation open the app and scan QR code by clicking “Scan QR code”or you can type the code after that click on “connect with code” button.

After Connecting, you can see the app on your phone.

NOTE: Your phone and computer must both be on the same wireless network.and your phone’s wifi is on.

3. Block Editor:

The Blocks Editor is where you program the behavior of your app. There are Built-in blocks that handle things like math, logic, and text with each components you have added.

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”.

Now click on the Label1. Click and hold the “set Label1 text to” block. Drag it inside the button click, it will run when the button is pressed.

At last, click on the text drawer, drag out a text block and plug it into the socket labeled to and write anything that you want to display. Click on the text block and write anything.

Now go to your connected device and press on the button. You should see the text “This is my First App” on the screen.

4. Sharing Apps:

You can share your application source code (.aia form) that can be loaded into app inventor.

Or you can share your app in an executable form (.apk) that can be installed on a device,

If you have any query please write us at support@roboindia.com

Thanks and Regards
Content Development Team 
Robo India
https://roboindia.com

Leave a Reply