Home Windows Apps Phone Apps Bespoke Contact Privacy

professor cad logo

Christopher J Ward
Engineer & Software
Developer


App Inventor Tips & Tricks

Really useful information! Get yourself a cup of tea and spend ten minutes reading!

GUI Layout Images Cannot Build APK Project File Care Getting Help on the App Inventor Forum Very Useful Links Extensions Installation Guide

GUI Layout

My Golden Rules:

Note that if deploying image buttons, especially for toolbars, they may have to be defined in pixels (height and width) to minimise distortion. In my experience, square buttons 50pix x 50pix (min 44pix x 44pix) can serve a range of different phone sizes. A Horizontal Scroll Arrangement (aka container) can ensure the User has access to all of the buttons on the toolbar.

Images

Defined and or managed incorrectly, images will take up too much memory and could cause a crash:

Cannot Build APK

Things to look out for:

Blocks Warning

Project File Care

"Good Housekeeping" pays dividends!

ExportProjectToComputer
Recycle Inline Comment
Open Puzzle Piece

Getting Help on the App Inventor Forum

An average of 400,000 Users per month means that you have a lot of competition for the attention of the Power Users (Technical Support Volunteers). Therefore, it is in your best interests to ensure that your help request is very carefully described and where appropriate supported with images and a small Test Project File (.aia) that demonstrates the problem.

If you are communicating with (IOT) hardware such as Arduino, BBC Microbit, Raspberry Pi, Banana Pi -include your Sketch/Script and connectivity (BlueTooth, BlueTooth LE [BLE], Network, WiFi, USB). Include your schematic or circuit diagram too.

If you are having trouble with App Inventor (rather than your work on your App) try this first: MIT: Troubleshooting for App Inventor 2

The Basics

Description: Tell Us:

How to insert an image of your Blocks into your Forum Post:

01/03
Slide 01 image
Right-mouse click: Clean-up Blocks.
02/03
Slide 02 image
Right-mouse click: Download Blocks As Image.
03/03
Slide 03 image
Insert the image into the Forum Post.

How to attach a Project File (.aia) to your Forum Post:

01/06
Slide 01 image
In App Inventor: Click Projects. Click "Export selected project (.aia) to my computer".
02/06
Slide 02 image
Select: "Save File". Click: "OK".
03/06
Slide 03 image
Forum Post: Click: "Attach a file".
04/06
Slide 04 image
Click: "Select files from your computer".
05/06
Slide 05 image
Select your file. Click: "Open".
06/06
Slide 06 image
The file is displayed as shown.

Forum Etiquette

MIT: App Inventor Forum Posting Guidelines

Links to all things App Inventor

Set Up App Inventor Learning App Inventor App Inventor For Teachers External Storage Arduino ESP8266 WiFi Module LinkIt Micro:Bit PIC Rasberry Pi 8051 microcontroller (Intel MCS-51) Bluetooth Robots Nordic Thingy 52 Extensions

General

MIT: Setting Up App Inventor
MIT: Updating App Inventor Setup Software
MIT Library: Documentation & Support
MIT: User Interface Components
Oracle: Date and Time Patterns [Used with the App Inventor Clock Component]
Summary of Android Manifest Permissions
Android Version Name, Version Number, API Level

Learning App Inventor    Back

MIT Beginner Videos
MIT Beginner Videos (same as above) hosted on Vimeo
MIT Book 2
Course In A box
MIT Tutorials
Sajal Dutta: App Inventor Blocks
Professor Wolber: App Inventor Tutorials

App Inventor for Teachers    Back

App Inventor for Educators
App Inventor Forum for Teachers: Educational Issues
App Inventor Forum: App Inventor Instructors
Teaching with App Inventor
Teaching App Creation with MIT App Inventor
MIT App Inventor Teaching Modules
App Inventor Starter Curricula

External Storage    Back

MIT: Using Google Sheets in MIT App Inventor
App Inventor: Post Data to Google Sheet
MIT:How to work with Fusion tables
MIT:Cloud DB
MIT: Firebase DB
Derek Banas: MySQL DB

Activity Starter    Back

MIT: Using the Activity Starter
Activity Starter Examples
Alex Fuentes: YouTube: MIT App Inventor 2 Activity Starter
Andy Havranek: YouTube: App Inventor 2 Activity Starter YouTube Link Tutorial
MIT:App Inventor2 Book: Chapter 6: launching other Android Apps from your App

Arduino and other Microcontrollers

Arduino    Back

Hot Tip: Ardunio Sketch (Script): Use println() to separate messages when you transmit.
App Inventor: Set DelimiterByte to 10 in BlueTooth Block.
Check that: Bytes Available > 0 in BlueTooth Block.
Then request -1 bytes to get full message.

Official Arduino Website
Arduino Basics Tutorial Blog (massive site, tons of info)
Arduino Tutorial: Learn Electronics using Arduino (not using App Inventor but a useful Arduino tutorial)
MIT: IoT: Introduction:Ardunio 101 (Note: other Ardunio boards are similar)
Random Nerd Tutorials: Arduino Trouble-shooting Guide
Instructables: Arduino Home Automation
CODEDUINO: Arduino Projects, Tutorials and News
Muhamad Andi Prasetyo: Video Tutorial: App Inventor 2: Android Receive Data from Arduino via Bluetooth
RANDOM NERD TUTORIALS: Rui Santos: Android Apps for Arduino with MIT App Inventor 2
RANDOM NERD TUTORIALS: Rui Santos: Arduino Step-by-step Projects: Build 25 Projects
Arduino-er: How to read service UUID and Characteristic of HM-10 BLE Module, using AT command
Design Spark: Arduino Stepper Motor Control
Becky's IoT Class: communicate with the ESP8266 and Arduino. Note: does not include App Inventor but if you want to know all about the ESP8266, very informative
Hackster: MisterBotBreak: How to Debute Arduino with LED (Beginner Introduction without using App Inventor)
EverythingESP: ESP32 Arduino Tutorial: Alarm with PIR motion sensor and buzzer
Martyn Currey: Arduino, HM-10 BLE Module and App Inventor
Arduino: Send SMS

Atmel ATtiny85/ATtiny84 (Atmel is part of Microchip Tech)    Back

Official ATtiny85 Website
Hackster: Robin Thomas: ATtiny85/84 micro controller with Bluetooth

ESP8266 WiFi Module    Back

Hot Tip: The ESP8266 ESP-01 WiFi Module can be used with or without a companion microcontroller. It is an SOC - System On a Chip.

ESP8266 Community Forum
Instructables: Getting-Started-With-the-ESP8266-ESP-01
Instructables: How to use the ESP8266-01 Pins and LEDs
Techiesms: Video: How to Program a ESP8266-01 using the Arduino IDE
EEVblog: Video: How to connect and use the low cost ESP8266 WiFi module with the Arduino environment
Techiesms: World’s Smallest IoT Project using the ESP8266 01 module
Becky's IoT Class: communicate with the ESP8266 and Arduino. Note: does not include App Inventor but if you want to know all about the ESP8266, very informative
Andreas Spiess: Video: Power Saving with ESP8266 (Sleep Mode) Tutorial with some Tricks
Geekstips: Internet Of Things Project – Communication Between ESP8266 Modules Arduino Tutorial
Electronics Hub: Control a Relay using ESP8266 and Android MIT App Inventor

LinkIt    Back

MIT: IoT: Introduction: LinkIt
MIT: IoT: LinkIt 7697
MIT: IoT: LinkIt Smart 7688/7688 Duo (Compatible with Arduino)
CAVEDU: Video: LinkIt 7697 component for App Inventor
Hackster.io: CAVEDU: App Inventor + IoT: Wi-Fi RGB LED control with LinkIt 7697
Hackster.io: CAVEDU: App Inventor: Bluetooth Low Energy LED control with LinkIt 7697
App Inventor TW: Project: App Inventor + IoT: LED Blink with LinkIt 7697
App Inventor TW: Project: App Inventor + IoT: LED Blink with LinkIt 7697 Video

micro:bit    Back

MIT: App Inventor Extension for micro:bit
MIT: IoT: Introduction: BBC micro:bit
MIT: IoT Starter Tutorial
MIT: micro:bit LED
MIT: micro:bit Temperature Sensor
MIT: micro:bit Potentiometer
Barry Byford: YouTube: MIT App Inventor BLE to micro:bit
CAVEDU: YouTube: micro:bit pin control with App Inventor and Bluetooth (BLE)
MIT: microbit Educational Foundation (microbit home website)
UK Baz: Creating an Android App for your micro:bit with App Inventor and Bluetooth (BLE)
sparkfun: Derek Runberg: Building a weather station with micro:bit and App Inventor
micro:bit Support: Why doesn't my computer detect my micro:bit?
micro:bit Support: Fault finding with a micro:bit

Nordic Thingy 52    Back

Nordic Semiconductor: Nordic Thingy 52 home page
Nordic Semiconductor: Nordic Thingy 52 Software development kit to create custom firmware for Thingy
Android Authority: Gary Sims: Video: Nordic Thingy 52 Explained
Symmetry Electronics: Cobus Heukelman: Video: Nordic Thingy 52 Demonstration
Nordic Semiconductor: Pär Håkansson: Video: Nordic Thingy 52 Introduction
Nordic Semiconductor: Getting started with Nordic Thingy 52 Iot Sensor Kit
Espruino (Web IDE): Nordic Thingy 52 Projects (Note: none are specific to App Inventor but could form the basis for App Inventor IoT use)
Embedded Artistry: Philip Johnston: Nordic Thingy 52 Kit Specifications
Nordic Semiconductor: Google Play: Nordic Thingy 52 App

PIC micrcontrollers    Back

DesignSpark: Basics of PIC16F877A microcontroller
components101: PIC16F877A microcontroller features, pin config, programming
components101: PIC16F877A microcontroller data sheet (PDF)
Bas van der Sluis: How to program PIC microcontrollers (youtube video)
Professor Douglas Soares, Brazilian Aeronautics Institute of Technology: Racing robots with App Inventor and PIC microcontroller
Electrotec: App Inventor, PIC16F877A microcontroller and Bluetooth HC05
Microchip: PIC microcontrollers Forum
EPE Magazine: Hobby Electronics

Rasberry Pi    Back

Digital Polymath: App Inventor 2 to Control our RPi Robot
EverythingESP: Raspberry Pi 3 Flask Tutorial: Receiving HTTP POST Request from ESP32 (App Inventor not included but very handy info)

8051 8-bit microcontroller (Intel MCS-51) [Embedded Systems]    Back

NPTEL: PDF: Specifications: Intel 8051 microcontroller
EL-PRO-CUS: Introduction to 8051 Programming in Assembly Language (The polar opposite to App Inventor coding but super-interesting)
introbotics: 8051 Microcontroller Programming Tutorials, Simulators, Compilers and Programmer. Huge links library.
NBCAFE: Ports in 8051 microcontroller. A nicely presented description of the Ports, with diagrams.
Electronics Hub: Bluetooth Controlled Electronic Home Appliances with 8051 Microcontroller, HC-05 Bluetooth Module, Android App (which could be defined in AI)
Electronics & Communication Engineering: Umesh Dutta: Robot controlled with App Inventor, Bluetooth HC05 and 8051 Microcontroller

Bluetooth    Back

Jon Gunnar Sponås: Effective Range of Bluetooth Communications
MIT: App Inventor BLE Extension (Bluetooth Low Energy) NEWEST VERSION RELEASED 24-11-2018
MIT:Bluetooth Client, Bluetooth Server
xkcd: Bluetooth Blues :)
Bluetooth.com: GATT Services
Instructables: Arduino Bluetooth HC06 (any microcontroller)
Robo India: Sending-Receiving with HC05 and App Inventor (any microcontroller)
PDF: Basic Two Way Bluetooth Communication via HC-05 Or HC-06 Between Arduino and Android (Not specific to App Inventor. Very informative nonetheless)
Text String Character Sets Supported by App Inventor Bluetooth Classic
US-ASCII Seven-bit ASCII (ISO646-US), the basic Latin block of the Unicode character set. 127 characters
ISO-8859-1 ISO Latin Alphabet Nº1, (ISO-LATIN-1)
UTF-8 Eight-bit UCS Transformation Format
UTF-16BE Sixteen-bit UCS Transformation Format, big-endian byte order
UTF-16LE Sixteen-bit UCS Transformation Format, little-endian byte order
UTF-16 Sixteen-bit UCS Transformation Format, byte order identified by an optional byte-order mark

Robots

LEGO MINDSTORMS    Back

MIT: IoT: Introduction: LEGO® MINDSTORMS® EV3 robot platform
MIT: LEGO® MINDSTORMS® NXT robots using Bluetooth

MIT App Inventor Codi Bot    Back

MIT: IoT: Introduction: Codi Bot
Maker Fair Hong Kong: Video: App Inventor Bee Bot

Video Formats    Back

MIT: App Inventor: Android Video Player Formats Supported

App Inventor Extensions    Back

Extensions Library maintained by App Inventor Expert Taifun Baer, including his own excellent Products

Pura Vida: App Extensions

How to install an Extension in App Inventor
Example Extension: MIT Bluetooth Lite Edition (BLE) Extension


01/10
Slide 01 image
Go to the Webpage that has a download link to the Extension.
02/10
Slide 02 image
Select "Save File".
03/10
Slide 03 image
Save the .aix file to your Computer.
04/10
Slide 04 image
Open your Project in App Inventor. Select "Extension".
05/10
Slide 05 image
Select "Import Extension".
06/10
Slide 06 image
Select "From My Computer".
Select "Browse".
07/10
Slide 07 image
Browse to the .aix file and "Open".
08/10
Slide 08 image
Select "Import".
09/10
Slide 09 image
Drag and Drop the extension item onto the Design View.
10/10
Slide 10 image
In the Blocks Viewer, select as required.