Home Windows Apps Phone Apps Bespoke Contact Privacy

professor cad logo

Christopher J Ward
Engineer & Software
Developer


Gauge

A Canvas-based Gauge where the pointer rotates according to input from the app or a microcontroller.
The code snippet is a self-contained mini App which you can easily copy to the BackPack and modify to work in your Apps.

 Free Download 

Gauge

GaugeBlocks

Get Error Info

Copy-Paste these Blocks into your Blocks View - essential error information when debugging your code.
The code snippet is self-contained, you can easily copy to the BackPack and paste into your App.

See this web page for an easy to navigate list of Error Codes and their related information:

Professorcad: App Inventor Error Codes

 Free Download 

Get Error Info

Create A Folder (Directory)

App Inventor does not provide a function for creating folders, but we can do it using the Canvas Component's ability to save files
The code snippet is a self-contained mini App which you can easily copy to the BackPack and cannibalise to work in your Apps.

 Free Download 

Create Folder

TinyDB: Multiple Namespaces

You could think of a Namespace as being a box. If you have several boxes (Namespaces), it makes sense to store related items in each.
For example: a box for shoes, a box for toys, a box for books and so on.

The code snippet is a self-contained mini App. On Screen1 we populate the TinyDB using 3 Namespaces. On Screen2 we populate a ListView from the TinyDB to prove that both Screens "see" the same TinyDB (ensure the name given to TinyDB is identical on each Screen!).

Note: When using Multiple NameSpaces, the Namespace TextBox in the Properties Palette should be empty - NameSpace names are defined in the Blocks Code. Also note how much of the code on Screen2 is similar to Screen1. This is an alarm bell telling us the code is inefficient! What we should consider instead is to use Virtual Screens.

 Free Download 


Screen1 GUI

Screen_MultiNameSpaceTinyDB_Scrn01.png


Screen1 Blocks

MultiNameSpaceTinyDB_Scrn01.png


Screen2 GUI

Screen_MultiNameSpaceTinyDB_Scrn02.png


Screen2 Blocks

MultiNameSpaceTinyDB_Scrn02.png

TinyDB: Backup to External File

You might need to backup your TinyDb data because if, for example, your app is uninstalled or overwritten, TinyDb data will be lost.

The code snippet is a self-contained mini App for you to play with as-is to get an understanding of how Store-Restore of data works. It is necessary to save the file on the virtual SD drive, since it would otherwise be lost in the same scenario that would lose TinyDB.

 Free Download 


Screen1 GUI

TinyDBBackupGui.png


Screen1 Blocks

BlocksBackupTinyDb.png

Run time: User control of ListView Text size

Across devices, there are massive differences in screen resolution. This can have a negative effect on text size.

This code snippet is a self-contained mini App which shows a simple way to give the User control of ListView Text size.

 Free Download 


GUI

ScreenResizeText.png


Blocks

BlocksResizeText.png

Run time: User Edit ListView Item (Row) Text

There are times when your User needs to edit one or more items in a ListView. Sometimes, the ListView is presented solely for the perpose of editing a List.

This code snippet is a self-contained mini App which shows a simple way to offer the User an InputBox with the List Item Text pre-set ready for modification.

You can modify the code to suit your needs.

 Free Download 


GUI

GUI_EditListView.png


Blocks

Blocks_EditListView.png

Run time: User Delete ListView Items (Rows)

So, how do we allow the User to delete Items (Rows) from a ListView? Let's start by explaining how not to do it! We should not delete Items by Index Number:

Example Original List:

  1. Apple
  2. Pear
  3. Banana
  4. Orange
  5. Plum
  6. Strawberry

List after Deletion of Index 5 (Plum):

  1. Apple
  2. Pear
  3. Banana
  4. Orange
  5. Strawberry

Now, having deleted Index 5, Index 6 no longer exists but Index 5 still does :)
This is because the List is re-indexed now it is shorter. If we tried deleting "Strawberry" using it's original Index (6), an error would occure because it has a new Index now (5).

So how do we safely delete Items? By finding the Item by Name, so we are sure to get the Item's new (current) Index.

This code snippet is a self-contained mini App which demonstrates a run-time method to allow the User to delete Items.

You can modify the code to suit your needs.

 Free Download 


GUI

GUI_DeleteListViewItems.png


Blocks

Blocks_DeleteListViewItems.png

Run time: User Move ListView Item (Row) to Top of List

Allow the User to move a Selected ListView Item to the top of the List.

This code snippet is a self-contained mini App.

You can modify the code to suit your needs.

 Free Download 


GUI

GUI_ListViewItemToTop.png


Blocks

Blocks_ListViewItemToTop.png

Run time: User Move ListView Item (Row)

Allow the User to Move a ListView Item (Row), up or down, row by row.
Note, the moved item in the screenshot is highlighted, but actually a programmatically moved Item does not get highlighted :(

This code snippet is a self-contained mini App.

You can modify the code to suit your needs.

 Free Download 


GUI

Gui_MoveListViewItem.png


Blocks

Blocks_MoveListViewItem.png

Run time: User Sort ListView Items

Allow the User to Sort ListView Items (Rows) Descending or Ascending.
The code uses a Javascript Sort function for a fast and accurate sort. The Items must be text, not numbers.

This code snippet is a self-contained mini App. The Javascript method used was derived from Taifun's idea: How to sort a list using the WebViewer(!)

You can modify the code to suit your needs.

 Free Download 


GUI

Gui_SortListViewItems.png


Blocks

Blocks_SortListViewItems.png

How to Load Snippet Code Blocks into your own Project

01/14
Slide 01 image
Go to the Folder where you have saved the Snippet file. If the Snippet file is zipped, extract it.
02/14
Slide 02 image
In App Inventor, Select 'Import project (.aia) from my computer'.
03/14
Slide 03 image
Popup: Select 'Choose file'.
04/14
Slide 04 image
Go to the Folder where you have saved the Snippet file. Select the .aia file.
05/14
Slide 05 image
Popup: Select 'OK'.
06/14
Slide 06 image
You are taken into the Loaded Snippet file. Note any component dependancies it has. In this example, Web and Notifier components.
07/14
Slide 07 image
Open the Blocks Viewer.
08/14
Slide 08 image
Right-Mouse Click Menu: Select 'Copy All Blocks to Backpack'. Alternatively, right-click on each Block required and select 'Add to Backpack'.
09/14
Slide 09 image
When there are Blocks available in the BackPack, it's icon should look like this (note, it sometimes shows the wrong icon).
10/14
Slide 10 image
Return to the 'My projects' List. Load the Project that you will load the Snippet into.
11/14
Slide 11 image
In your Project, Screen View, insert dependancy components as required.
12/14
Slide 12 image
Open the Blocks Viewer.
13/14
Slide 13 image
Right-Mouse Click Menu: Select 'Paste All Blocks from Backpack'. Alternatively, click on the Backpack and drag-out the Blocks required.
14/14
Slide 14 image
When finished, don't forget to Empty the Backpack!