Creating a Bluetooth Android App using App Inventor #tt22
Tinkerer: Lory Livezey
App Inventor is an open source platform that allows you to create Android apps using a drag and drop interface. We've already learned how to create a simple app and test it on our Android device. In this tutorial, we're going to learn how to create an app that can connect to a Bluetooth Device.
Objectives
You'll learn how to:
- Use the Bluetooth Connection tool in App Inventor
- Program the List Picker to display a list of bluetooth devices on the Android
Previous Step
Create a Hello World Android App in App Inventor #tt21
What You'll Need
You'll need a Windows Computer, Mac or Raspberry Pi, and an Android Phone or Tablet. You'll also need a bluetooth device to connect to.
What We're Doing
We're going to connect to the HC-06 Bluetooth Module that we connected to the Arduino in TurboTinker #20. Then we're going to create a simple mobile app that allows you to press a button, then displays all of the available bluetooth devices in range. Once you select the bluetooth device, it will display a message once connected.
Starter Breakpoint
The App Inventor project:
- We'll be starting from scratch
Browse to the App Inventor Web site
I try to do everything possible on the Raspberry Pi, because some students may have only that to use. So I will remote into my Raspberry Pi, though you can use a Mac or PC for this. Open up the the App Inventor Web Site, and log in using your Google account:
Start a New Project
Once you're logged in, click 'Start New Project'. No spaces or dashes are allowed.
Set Up Bluetooth
Click to open your project. To get started, we'll drag a Bluetooth Client from Connectivity.
We'll use a ListPicker to display a list of available bluetooth devices:
Next, we'll center it by putting it in a HorizontalArrangement container.
Click on the HorizontalArrangement Container, and set to "Fill Parent" so it covers the width of the device.
Click on the BlueToothList, and change the text to Connect, and center it.
Drag another Horizontal Arrangement and place a Label in it. This will display the status of the connection. Center it, increase the font size, Change the Text to Disconnected.
Add a Clock Component
Drag a clock component to the canvas. We'll need this to periodically check our bluetooth connection.
Program in Blocks View
Click on Blocks to go into Blocks View. Notice the names of our ListPicker and Status box. Not too descriptive.
Click back on Designer, and we'll change the names by selecting them in the Components pane, and clicking 'Rename'. We'll name them BluetoothList and Status.
The BluetoothList.BeforePicking Block is an event that we'll use to populate the box with bluetooth devices in range at just the right time.
The BluetoothList.AfterPicking will trigger after you've selected a device. We'll use an if/then and if an item was selected, then check for a connection. If so, send the word "Connected" to the Bluetooth server, and make the BluetoothList invisible.
Next, we'll work on our clock block. It will trigger at a set duration -- it defaults to one second. So every second we're going to check the status of the connection. We'll use an if/then block, and if the bluetooth client is connected, then we'll set the status text to Ok. Else, we'll set it to disconnected.
We'll also set the text on the screen to "Connect".
Install AI Companion & Test
Let's connect to the Android to test it. Select Connect, then AI Companion:
It will generate a QR code, that you can either scan or enter into your device:
Type in the QR Code, and connect to the bluetooth device.
Add Disconnect Button
That's good, but what if we now want to disconnect?
Let's go back and add another button, call it Disconnect:
Hide it initially. We'll make it visible in the code when we're ready:
Go back into blocks view, and drag a "When disconnect click do" block, we're going to set the bluetooth list to visible, the disconnect button to invisible, and we're going to disconnect the bluetooth connection.
We'll set the button to visible after we connect.
Test Again
Now, let's run it again. It's working more like you would expect it to.
In this tutorial, we connected our Android app to an HC-06 bluetooth module using App Inventor, and then we used the AI Companion app to test it on our device. Stay tuned, because we'll build on this to control the Tinker Pi Robot using an Amazon Kindle.
Finish Breakpoint
This file can be uploaded into App Inventor:
Next Up
 | Test MIT App Inventor on the Amazon Kindle #tt24 |
 | Connect Your Android Phone to Arduino Using App Inventor #tt23 |
