This page is still under construction at present
What is App Inventor?
It is a graphical coding system using html and java for creating android phone/tablet apps
How do I get started?
Go Here: http://appinventor.mit.edu/explore/
Me and App Inventor
I have been using App Inventor (AI2) for about 4 years now, driven mainly by some opportunities at my work to create communication apps for autistic children, and data recording apps for the staff. I am not a programmer, it is just a hobby/sideline (which my work are happy for me to pursue). AI2 can be frustrating at times – because it can’t do everything you want, the OS can be a bit slow, but the output can be great and just what you want, eventually! I have listed below some of the code snippets that I have used ( can’t claim to be the creator, that accolade goes to others far cleverer than me). These snippets save time, effort and help you get the best out of AI2. I hope you find them of use too.
Some Golden Rules
- Plan out your app on a piece of paper first, seeking out the logic as you go
- Build you app bit by bit, don’t try to do everything in one go
- Save your Project regularly, and regularly download an aia file to your PC
- Make checkpoints of your app when you reach certain milestones
- If you can avoid using more than one screen, do so
- You cannot rename Screen1, although you can change it’s title
- If you find you have sections repeating themselves, revisit the code/blocks, try to write procedures so that you can reuse them, and you only write a pice of logic once
- The same goes for buttons or images, can you recode to use just a few buttons or images instead of many. Code is cheap, screen assets cost!
- You cannot build an AppInventor app any bigger than 5mb, so keep asset sizes down to a minimum
- Test in your emulator of choice, and with a built app – behaviour can be different
- Ask questions on the AppInventor Forum
- Another great resource is Taifun
Make A Splashscreen
- Start a new Project
- Drag out a Vertical Arrangement and make it “fit parent” both ways
- Drag out a second Vertical Arrangement below the first and make it “fit parent” both ways
- In the first VA insert your background image, or images and text required
- In the 2nd VA just drag out a label and type “This is the app” into it
- Untick visible for the 2nd VA
- Ensure “scrollable” is unticked for VA1
- Drag out a Clock Timer from Sensors, set interval to 3000 milliseconds, leave timer as Always Fires
- Move to the Blocks Editor
- Drag out a Clock.Timer block
- In it you need:
- 1st VA visible = false
- 2nd VA visible = true
- Clock.Enabled = false
- In it you need:
- Test in Emulator
- On load, 1st VA should display for 3 seconds to then be replaced by 2nd VA and “This is the app” message
Explanation: When the app opens, the timer is fired, and VA1 is displayed, after 3 seconds, VA1 becomes invisible and VA2 is displayed
Simulated Multiple Screens
I have already partially covered this in Make a Splashscreen above, but in its simplest form:
- start a new project
- drag out three vertical arrangements
- drag a button into each VA
- make all VAs fit parent both ways
- Untick visible for VA2 and VA3
- change the background colour if you want for more effect
- Ensure “scrollable” is unticked for Screen1
- Move to the Blocks Editor
- Drag out the Button.Click block for each button
- In Button1.Click add VA1.visible = false and VA2.visible = true
- In Button2.Click add VA2.visible = false and VA3.visible = true
- In Button3.Click add VA3.visible = false and VA1.visible = true
- Open up your emulator
- You should see VA1 and Button1. Click It.
- You should see VA2 and Button2. Click It.
- You should see VA3 and Button3. Click It.
- You should be back to VA1 and Button1
The possibilities are endless, the amount of coding/blocks, complexity and size of app is significantly reduced against using more screens (as advised against)
List of Lists with a CSV file
As much for my own benefit as anything else, as I keep forgetting how to do this. You can build a list of lists using text blocks and the “list from csv row” blocks, but this hard codes things into the app. If you want a bit more freedom and ability to update the lists without updating the app (more on that later) it may be better to create a csv file and call this as a list of lists.
So here are the blocks required for a hard coded list of lists, using a button to fill out a label with the chosen item
Here are the blocks for using a csv file to do the same thing, along with a view of the csv file
The output of both to show that you get the same thing back