Tag Archives: appinventor

Arduino, Components, Programming Method, Uncategorized

Part 3: Bluetooth communications with 2 Arduino devices, using App Inventor

4 Comments

Please start with “Part 1: Basic Bluetooth communications using App Inventor” to learn how to configure, set up and program an App Inventor app that communicates over Bluetooth between two Android devices. Then, read “How to connect App Inventor apps to Arduino using Bluetooth” before going through this tutorial!

Then continue with this tutorial.

This tutorial shows how an App Inventor app can communicate with 2 (or more) Arduino boards and Bluetooth devices simultaneously. These instructions assume you are familiar with the code and hardware presented in Part 1 and Part 2 and “How to connect App Inventor apps to Arduino using Bluetooth“. This tutorial uses the same Arduino source code as in that tutorial.

A follow up tutorial will show how to simplify some of this code for supporting multiple Bluetooth devices.

Brief Reminder

Bluetooth is a short range, low power, limited speed wireless communications technology. The original Bluetooth technology provided a serial communications link between two paired devices (as compared to an individual data packet sent between up to n devices using the much newer Bluetooth LE – see here and here for information on Bluetooth LE).

Arduino is a microcontroller board for building hardware projects. You can write software for Arduino using a programming language similar to the C++ programming language.

The code used in these examples has been tested with some specific Bluetooth modules connected to Arduino. These include the JY-MCU (Amazon (Prime), Amazon (non-Prime) and also some HC-05 and HC-06 based Bluetooth modules.

Getting Started

  • Read the prior tutorials (Part 1 and Part 2 and “How to connect App Inventor apps to Arduino using Bluetooth“)
  • Build two Arduino boards each with an appropriate Bluetooth module as described in the prior tutorial.
  • Compile and load the Arduino software in to each of the Arduino boards.
  • Test and confirm that your basic LED lights flash for the original, single Bluetooth connection case.
  • Then, with two working boards, continue to this tutorial.

User Interface View

The original app supported just one device, so there was just a single “Connect” and “Disconnect” button. This version demonstrates how to connect more than one Bluetooth device so we need separate buttons for each device. Similarly, we must add a second status and data sending item to the screen:

 

Before running this app, be sure to use Android | Settings | Bluetooth to “pair” your Bluetooth devices with Android.

Then, run the app and select Connect to Device 1. This displays a list of available Bluetooth devices in the vicinity. Select your specific Bluetooth device for the connection. Do this for both Bluetooth devices.

Once connected, you can send some simple commands to the Arduino board. Commands are very simple – a single number – to tell the Arduino to do something (this confirms that the Bluetooth link is working). If we enter a single digit 1 and then press Send Numeric 1, the Arduino board will send back 2 bytes of data which will then be displayed on the app screen. If we enter a single digit 4 and then press Send Numeric 1, a value of 4 is transmitted over Bluetooth to the Arduino board, which responds by flashing the externally connected LED.

Because the text box for data entry has its property set to NumbersOnly, a pop up numeric keypad displays when entering data, rather than the usual Android text keyboard.

Video Demonstration this App

I created a short video showing this app in operation. There are two versions of the video – one is standard 2D format and the other is in VR 3D format for viewing on Google Cardboard-like viewers used with smart phones to watch VR videos.

2D (normal) version: https://youtu.be/BU2gIAxbY_o

VR 3D SBS version: https://www.youtube.com/watch?v=UJIggzZgld4

That version is in 3D, for viewing with VR 3D viewers or 3D TVs or monitors.

Continue reading Part 3: Bluetooth communications with 2 Arduino devices, using App Inventor →

Android Development, Tips, Uncategorized

Using droid-at-screen to see your phone’s display on your computer

1 Comment

droid-at-screen is a free Java-based app that displays the content of your phone’s display to your computer’s display, when the phone is connected via a USB cable.

Below is a screen snap shot taken from my computer display. At the upper left is the Droid@Screen application running.  Droid@Screen is connected to my Nexus 5 phone.

At right is the display showing on my phone, which has been transferred from the phone to my computer over a USB connection. I’ve circled two user interface items – the magnifying glass icon is used to adjust the display size of the phone’s screen. Since the phone has a 1920×1080 display, the initial image is quite large!

Below that is a camera icon. Click on that to take a snapshot of what is on the screen, and then save the screen image to a local file.

Capture

At the lower left is the DroidAtScreen .jar file. This is the Java executable program file. Assuming Java is installed on your system, double click the .jar file to begin running Droid@Screen.

Continue reading Using droid-at-screen to see your phone’s display on your computer →

Components, Programming Method, STEM Education, Uncategorized

A “switch board” user interface panel for App Inventor apps

4 Comments

In the last post, we introduced some concepts for building “creative” App Inventor user interfaces that feature visually appealing user interface controls rather than the usual bland buttons.

In this post, we look at creating an array of toggle switches. Tapping a switch flips the switch from left to right, or right to left.

Concepts

In developing this user interface, we learn two concepts:

  1. We expand on the previous post and its use of images to create custom buttons.
  2. We see how a user interface control can be stored in a list and referenced like a variable within our apps.

Source code:

The User Interface

I called my app “Mission Control” because any good mission control panel needs lots of switches!

The user interface features 9 toggle switches in a 3 x 3 array. The purpose of this app is to demonstrate how to implement this type of interface – the app does not otherwise do anything interesting.

Tapping any toggle switch causes the switch lever to move to the other side of the switch. Here is a screen shot showing some toggle switches to the left and some to the right.

Screenshot_20160204-140323The Designer View

Continue reading A “switch board” user interface panel for App Inventor apps →

Components, Programming Method, STEM Education, Uncategorized

Scanning bar codes and QR Codes with App Inventor Apps

23 Comments

Overview

App Inventor supports scanning of product identification “bar codes” and QR codes. Bar codes are typically found on consumer product packaging. QR codes are used for web addresses (so you can scan the QR code and go directly to the web address), part and product inventory tracking, and to deliver short messages.

In this tutorial, we create a simple App Inventor app to scan bar and QR codes.

Update: José Luis Núñez provides his own tutorial (in Spanish) for a bar code scanning app to check seating in a theater (written in App Inventor). Watch it on Youtube here:  Curso de App Inventor 2 (José Luis Núñez)

User Interface

Our App Inventor app has a simple user interface – a single button to scan either a bar or QR code. When pressed, the app activates the camera to scan the code and then returns a result value.

If the code is a numeric bar code value, the app displays a web page of information about the item corresponding to the bar code. If the returned code contains a web address, then that web address is displayed on screen. Here is an example from scanning the UPC code on a package of tea:

Screenshot_20151130-134823In the next example, a QR code containing http://appinventor.mit.edu is scanned:

static_qr_code_without_logoAnd here is the result:

Screenshot_20151130-134746Designer View

Drag a WebViewer component from the Palette’s User Interface section, and drag a BarCodeScanner component from the Sensor’s section. The WebViewer is the “earth” icon in this screen, and the BarCodeScanner is an invisible component, below the canvas area.

BarCodeDesignerTwo labels are used – one to display the text “Result:” and the other to display the returned code.

BarCodeComponentsBlocks Code

To activate the BarCodeScanner, we call the DoScan method:

BarCodeBlocks1The above activates the camera and displays a view on screen (in Landscape mode). Once a bar code or QR code is successfully scanned, the camera is automatically turned off and an AfterScan event is generated.

The AfterScan event has one parameter named result; this contains the converted scan code – a numeric value for a bar code or an http:// URL for a web address (anything else is displayed in the lblBarCodeResult label, on screen).

BarCodeBlocks2Creating QR Codes

To create your own QR Code images use any of the QR code generators available online – just search for “Create QR Code free” – I used http://www.qrstuff.com/

Download Source

Right Click (or Ctrl-Click on Mac OS X) and choose “Save as” (or similar wording): BarCode_Scanner.aia

E-Books and Printed Books

If you find these tutorials helpful (I hope you do!) please take a look at my books on App Inventor. To learn more about the books and where to get them (they are inexpensive) please see my App Inventor Books page.

  • App Inventor 2 Introduction (Volume 1 e-book)
    Step-by-step guide to easy Android programming
  • App Inventor 2 Advanced Concepts (Volume 2 e-book)
    Step-by-step guide to Advanced features including TinyDB
  • App Inventor 2 Databases and Files (Volume 3 e-book)
    Step-by-step TinyDB, TinyWebDB, Fusion Tables and Files
  • App Inventor 2 Graphics, Animation and Charts (Volume 4 e-book and printed book)
    Step-by-step guide to graphics, animation and charts

Thank you for visiting! — Ed

 

Components, Software, Uncategorized

MIT App Inventor “Extensions”

Leave a comment

Some new “extension” features are available for testing in App Inventor at MIT App Inventor Extensions. The 4 extensions include vector addition, simple image processing, simple audio processing to identify the pitch of a sound, and the addition of multi-touch gestures to the Canvas.

I have not yet had time to try these but this is a sign of things to come as 3rd parties can begin to develop extensions to the core set of App Inventor features.

Look forward to trying these out! Click on the link above to take a look.

Components, Documentation, Programming Method, Software, STEM Education, Uncategorized

Free-Download App Inventor Text Files Cheat Sheet

6 Comments

Download here: App Inventor Basic Text Files Cheat Sheet (PDF)

High res, suitable for printing. Feel free to share with others.

App Inventor sample source code: TextFile.aia

Be sure to follow the links for more information about text files and where they are stored on your device and how to transfer files to your computer.

Here is a GIF image but use the PDF for printing:

Voila_Capture 2015-11-02_10-45-33_AM

E-Books and Printed Books

If you find these tutorials helpful (I hope you do!) please take a look at my books on App Inventor. To learn more about the books and where to get them (they are inexpensive) please see my App Inventor Books page.

  • App Inventor 2 Introduction (Volume 1 e-book)
    Step-by-step guide to easy Android programming
  • App Inventor 2 Advanced Concepts (Volume 2 e-book)
    Step-by-step guide to Advanced features including TinyDB
  • App Inventor 2 Databases and Files (Volume 3 e-book)
    Step-by-step TinyDB, TinyWebDB, Fusion Tables and Files
  • App Inventor 2 Graphics, Animation and Charts (Volume 4 e-book and printed book)
    Step-by-step guide to graphics, animation and charts

Thank you for visiting! — Ed

Components, Documentation, Programming Method, Software, STEM Education, Uncategorized

Free-Download App Inventor Location Sensor Cheat Sheet

8 Comments

Download here: App Inventor Location Sensor Cheat Sheet (PDF)

High res, suitable for printing. Feel free to share with others.

App Inventor sample source code: Location_WhereAmI.aia

Here is a GIF image but use the PDF for printing – also, where it says “enter a mailing address”, that should probably be “enter a street address”!

Voila_Capture 2015-10-28_12-21-17_PM

Post comments here or on our Facebook group page. Thank you!

E-Books and Printed Books

If you find these tutorials helpful (I hope you do!) please take a look at my books on App Inventor. To learn more about the books and where to get them (they are inexpensive) please see my App Inventor Books page.

  • App Inventor 2 Introduction (Volume 1 e-book)
    Step-by-step guide to easy Android programming
  • App Inventor 2 Advanced Concepts (Volume 2 e-book)
    Step-by-step guide to Advanced features including TinyDB
  • App Inventor 2 Databases and Files (Volume 3 e-book)
    Step-by-step TinyDB, TinyWebDB, Fusion Tables and Files
  • App Inventor 2 Graphics, Animation and Charts (Volume 4 e-book and printed book)
    Step-by-step guide to graphics, animation and charts

Thank you for visiting! — Ed

Documentation, Programming Method, Software, STEM Education, Uncategorized

All new tutorial: Using TinyDB in App Inventor

9 Comments

I have completely rewritten and re-done my original tutorial on using TinyDB in App Inventor.

You can see the all new rewrite at Using TinyDB in App Inventor

TinyDB is a database used to store and retrieve values to semi-permanent storage on your phone or tablet. Unlike variables, which vanish when your app closes or your phone is turned off, values stored in the TinyDB are retained and can be accessed again, much later.

The original post was a popular post here on the blog, but it was brief and left out some details. I started over from scratch and wrote an all new, complete tutorial, with screen shots and blocks code, and downloadable App Inventor source code. Hope this helps!

E-Books and Printed Books

If you find these tutorials helpful (I hope you do!) please take a look at my books on App Inventor. To learn more about the books and where to get them (they are inexpensive) please see my App Inventor Books page.

  • App Inventor 2 Introduction (Volume 1 e-book)
    Step-by-step guide to easy Android programming
  • App Inventor 2 Advanced Concepts (Volume 2 e-book)
    Step-by-step guide to Advanced features including TinyDB
    • App Inventor 2 Databases and Files (Volume 3 e-book)
      Step-by-step TinyDB, TinyWebDB, Fusion Tables and Files
      Buy from: Amazon, Google Books, Kobo Books
  • App Inventor 2 Graphics, Animation and Charts (Volume 4 e-book and printed book)
    Step-by-step guide to graphics, animation and charts

Thank you for visiting! — Ed

Android Development, App Inventor News, Software, STEM Education, Uncategorized

FIRST Tech Challenge (Robotics) can now use App Inventor

3 Comments

Early in 2015, FIRST announced that the First Tech Challenge (FTC) robotics platform would be powered by the Qualcomm Snapdragon processor (the same processor used in most Android phones).

Starting with the Fall 2015 FTC competition, students can now control the robot using App Inventor. (Go here and page down to App Inventor Download and Resources and follow that link).

FTC uses a version of App Inventor that is installed on a local computer rather than running over the Internet, as we do with MIT App Inventor.

About FIRST

FIRST robotics is an “academic sport” for the mind as teams are faced with the challenge of conceptualizing, designing and building a complex robot to solve a challenge. The Mission of FIRST Robotics:

“Our mission is to inspire young people to be science and technology leaders, by engaging them in exciting mentor-based programs that build science, engineering and technology skills, that inspire innovation, and that foster well-rounded life capabilities including self-confidence, communication, and leadership.”

Volunteering

I am in my 8th year of volunteering as an engineering mentor to high school robotics teams. I am currently a volunteer with Glencoe High School’s Team #4488 “Shockwave” team where I am the lead mentor for Apps Software. Our team is a student-led team. The students make the design choices and implement the solutions. The mentors assist with technical and management training and specialized learning.

Our team, like many FIRST teams, is run similar to a business with separate sub-teams not only for robotics (mechanical, electrical, robot programming, CAD) but also other functions (marketing, business, strategy, web and applications software, graphic design) and even an animation team. Our applications team produces support software for the entire team by creating custom tablet apps and Windows applications software that assist in various information collection, analysis and processing functions. Last year, the team also created a robotics game that is available in the Google Play store.

There are many opportunities for volunteering – from technical engineering to business and marketing, graphic and art design, wood and metal working, CAD, and teaching. Visit usfirst.org to learn more!