Embedded Files
There are 2 main areas in the user interface of App Inventor:
Designer
Designer
Block
Block
In “My Projects”, you can view the list of all your projects, you can click “Start new project” to create a new project:
Test by emulator:
You can test your app without an Android device. You can use the emulator “aiStarter” to test your app. https://appinventor.mit.edu/explore/ai2/setup-emulator.html
Whenever you want to test your app in the emulator, you have to open aiStarter first.
Adding components and creating new screens:
A screen is where you put the components of your app. You can drag an component from the Palette to Viewer.
You can edit the properties of the current screen on the Properties panel.
If you need a totally different layout, you can create more screens and switch between them in runtime. The default screen is called Screen1. To add a new screen, you can click "Add Screen..." above Viewer. Then input a name for the new screen and click "OK".
Components in Palette:
Button
A button is designed to trigger a series of actions when it is clicked. Its properties can be viewed in Properties.
Image
Images can show pictures from the media resources of the application on the screen. The pictures you want to show should be uploaded via Media first, then you can set the "Picture" property of the Image component to the corresponding picture.
Label
A label is used to display text. You can define the settings through Properties.
Textbox
A textbox is used for text input. It usually appears together with a button so users can notify the application when they finish typing. You can also set the textbox to accept numbers only.
Built-in Blocks:
Control blocks
Control blocks are used to control the flow of the app or some operations. "If...then...else", "open another screen" and "close screen" are some frequently used control blocks.
Logic blocks
Control blocks are used to control the flow of the app or some operations. "If...then...else", "open another screen" and "close screen" are some frequently used control blocks.
Math blocks
Users can perform mathematical calculation using the math blocks. You can also generate random numbers and set a numerical value using math blocks.
Text blocks
Text blocks are used to create , edit, and remove text. You may also type the file name into a text block to read files in the application.
Lists blocks
When you want to group several values together, you can use a list to store the values.
Colors blocks
You can set the colour of the components using color blocks, for example you can use them for the background colour or the colour of your drawing. Users can define other colours by using the "make color" block with RGB values.
Variables blocks
If you want to store a value that can be changed while the app is running, you can use the variables blocks.
Procedures blocks
Procedures blocks allow users to group a set of blocks together, which can be reused daily just by calling the procedure name.
Component blocks:
Component blocks control the components that you add in Designer view. You can change the properties of components using component blocks.
For example, these are the component blocks of Button1.
Event-driven program:
In an event-driven program, instructions are run when a specific event happens. For example, when Button 1 is clicked, change the text of Label 1 to "Hello".
To complete an event-driven program, you will have to group 3 types of blocks:
Event handler (when)
Action (what)
Value (how)
Event handler:
These blocks start a set of actions under certain conditions. One example is the "when Button1.Click" block, which starts a set of actions when the user clicks Button1.
Action:
These blocks only indicate actions. They cannot start on their own and hence must be put inside event handlers. For example, "close application" block tells the phone to close the app while "set Image1.Picture to" block sets the file name of Image1.
Value:
These blocks specify values. They must be connected to blocks that indicate a single action.
Here is an example of using 3 types of blocks together.
Reference: The New Era of ICT App Development: App Inventor 2, 2018, Hong Kong Unific Publishing Limited
Page updated
Report abuse