Category Archives: Documentation

App Inventor News, Components, Documentation

App Inventor introduces copy and paste of code blocks!

18 Comments

App Inventor has introduced “copy and paste” of code blocks. Now you can copy blocks of code within a current screen, or from one screen to another screen, or even between projects. This is great news!

Look for the “backpack” icon at upper right of the blocks Viewer screen:

AI_Copy1

Select a block or blocks with the mouse pointer, and then click and drag the selected blocks into the backpack. A copy of the blocks are placed into the backpack and your original blocks also remain in the editing window.

Click on the backpack icon and it displays the code blocks currently stored in the backpack:

AI_Copy2

Click on the code block in the backpack (at right) and drag it into the Blocks Viewer. That is all you need to do to copy blocks.

Use this feature to copy blocks within your current screen, or to copy blocks from one screen to another screen, or to copy blocks from one app to another app.

You can put several blocks into the backpack, and then select only the ones you wish to copy over to another blocks Viewer.

How do you empty the backpack? It seems the only way to empty the backpack of saved items is to close the editing windows, go back to the MIT App Inventor home page (http://appinventor.mit.edu/) and select the Create apps! button to re-enter the designer and blocks editor.

Regardless, this is a GREAT NEW FEATURE! Thanks MIT App Inventor team!

Documentation, General

Tip on inserting images into Microsoft Word

Off topic a bit but this may be helpful to others inserting images into Microsoft Word documents or trying to create better images in e-books.

E-Book Images

The past few days I have been looking at ways to improve the image quality in e-books. Images are not handled well by e-book development software and some of the problems are due to undocumented “features” and software defects.

Three common file formats for images are JPG, GIF and PNG. JPG images are good for photos but not great for drawings (like App Inventor block code). However, Amazon secretly decides on its own whether or not one’s JPG images are sufficiently compressed and makes its own secret decision to recompress the original JPG even more, losing resolution in the e-book.

Images that start as PNG files are converted to JPG files by the software that creates the e-book formatted files.

GIF files go through the process “as is” and remain as unchanged GIF files. GIF files are best for drawings (rather than pictures) with lots of solid colors. Therefore it is best to use GIF files for illustrations such as App Inventor “blocks code”.

The basic rule for e-book authors is to use JPG images for photos and GIF files for drawings and illustrations (non-photo images).

Microsoft Word Turns Inserted Images into Blurry Images!

Today I discovered Microsoft Word converts clean GIF images into blurry images when GIF files are added to a document.

I was working with a document that had older images, captured and inserted differently some time ago. Those images looked nice and sharp. But when I imported new GIF screen captures, the new images looked soft and fuzzy. Word is converting (and recompressing) the imported GIF files and reducing their image quality. There is no way to turn this “feature” off in Word! This “feature” creates images that are unsuitable for e-books or printed book use.

This is a “known defect” (“feature”) introduced by Microsoft Office Word in 2010. I discovered this on Mac OS X Office 2011. The work around is save your Word document in the older 1997-2004 .doc file format. Now, when you insert images into the file, they appear correctly.

This is documented in a Microsoft forum here. Related issue in MS Powerpoint.

Afterword: I also tried OpenOffice, which I like, but ran into other problems there such that OO was not a solution either.

Components, Documentation, Programming Method, STEM Education

Tip: Using component colors to find components in the Blocks Editor

Finding a specific programming block with in the AI2 Blocks editor can be hard for new AI programmers.

You found a great code example online and want to recreate it by entering the blocks in to your program – but you cannot find that red block in the middle of the code sample? Where is it? !!!

You start poking around the drop down lists, scanning up and down the pop up menus, missing it the first time(!) and then going through all the blocks again until you finally locate that darned block! Frustrating!

Continue reading Tip: Using component colors to find components in the Blocks Editor →

Documentation, STEM Education

App Inventor 2: Databases and Files – available shortly

7 Comments

Volume 3 – focusing on TinyDB, TinyWebDB, Fusion Tables and text files – is now Available.

————————————————————————-

App Inventor 2: Databases and Files is a step-by-step guide to writing apps that use TinyDB, TinyWebDB, Fusion Tables and data files for information storage and retrieval. Includes detailed explanations, examples, and a link to download sample code. This is the first tutorial to cover all of these App Inventor database and file features.

If your apps need to work with data or files – you need this book!

TinyDB stores data on your smart phone or tablet and is a primary way for App Inventor apps to save data, even when the app is no longer running or if the device is turned off.

TinyWebDB is similar to TinyDB, but stores your data on a remote server in the network cloud.

Multiple apps can share a TinyWebDB database, plus you can update the content of your TinyWebDB using just a web browser. This means you can distribute an app whose content can change over time – just by changing the values in TinyWebDB.

A big challenge is the need to set up a TinyWebDB server – this book shows how to do that through free services offered by Google.

Fusion Tables provide a powerful, cloud-based database system for App Inventor apps. Creating, retrieving, updating and deleting data is done using the industry standard Structured Query Language or SQL. Fusion Tables reside in the Google network cloud – this book shows you how to set up and configure Fusion Tables for you own apps using free services of Google. As your app requirements grow, Google’s cloud can provide low cost servers and bandwidth for your needs.

Underneath the Android OS user interface, there is a file system, similar to the file system found on Windows or Mac OS X. With App Inventor your apps can write and read data from files, and if using the special “CSV” format, App Inventor data can be shared with many spreadsheet programs. This book shows you how to create, use and access data files, and how to convert data to and from the CSV format.

Over 28,000 words. Amazon’s page count is 322 pages. Over 250 screen shots and illustrations. Numerous sample programs and code.

App Inventor 2: Databases and Files – Table of Contents
1 – Introduction
2 – Using the TinyDB database
3 – Implementing Records Using Lists in TinyDB
4 – Simulating Multiple TinyDB Databases
5 – How to Use Multiple Tags in TinyDB
6 – Introduction and Setup: TinyWebDB
7 – Managing TinyWebDB in the Cloud
8 – Programming for TinyWebDB – Demo 1
9 – Adding a Tags List to TinyWebDB – Demo 2
10 – Handling Multiple Users with TinyWebDB – Demo 3
11 – Implementing a Student Quiz Application using TinyWebDB
12 – Introduction to Fusion Tables
13 – Developing Your Fusion Table App
14 – Using Text Files in App Inventor

Documentation, General, Products, STEM Education

Pre-Announcing: App Inventor 2: Databases and Files-new e-book

10 Comments

Available now: App Inventor 2: Databases and Files

I have finished writing App Inventor 2: Databases and Files, a new e-book providing step-by-step guides to using TinyDB, TinyWebDB, Fusion Tables and Data Files in Android App Inventor programs, including sharing data with spreadsheets.

Continue reading Pre-Announcing: App Inventor 2: Databases and Files-new e-book →

App Inventor News, Components, Documentation

App Inventor to add “Responsive Design” features next week

8 Comments

MIT App Inventor upgrade coming next Monday – the upgrade will support apps running on devices with different size screens, such as a smart phone versus a tablet.

There’s one important rule when using App Inventor to create apps with responsive design:

Specify widths and heights of components as percentages of the screen width and height, rather than as fixed numbers of pixels.

For example, to make a button whose width is half the screen width, set the button’s width to be 50 percent rather than setting it to a specific number of pixels.

See Responsive Design in App Inventor

Please see the link for details on this upcoming change.

Apps written in Java and the Android SDK have access to additional methods of creating flexible design layouts, or even multiple layouts, for different screen sizes.