Android Programming‎ > ‎AppInventor‎ > ‎

Topic 2

Topics 2: Properties and events of a component. Simple calculation and assignment statements.


Key points:


Events and properties of different components

Component

Event / Properties

Description

Button

Click

Indicates a user has long clicked on the button

 

GotFocus

Indicates the cursor moved over the button

 

LongClick

Indicates a user has long clicked on the button

 

LostFocus

Indicates the cursor moved away the button

TextBox

Text

The text stored in the Textbox

Label

Text

The text stored in the label

 

Visible

Set to True to show the Label

 

TextColor

Color of the text.

 

Build in Blocks

Maths

Maths Operator: Add, Subtract, Multiply, Division

Maths operator

Relational Operator:

Relational operator

Logic

Logic value: True, false                   Logical operator: not, and, or

logic

color

Blue, Red, Yellow, Green

color

Control

Selection: If..then,  if..then..else

if..then..else

  

Practical 2A: Calculating Body and Mass Index (BMI)

Program requirements:

1.      Input your weight (in kg) and height (in m) in 2 Textbox.

2.     When a Button was clicked. Calculate the BMI ratio with the formula: BMI = weight / (Height x Height)

3.      Show the BMI value in a Label.

 

Instructions:

A.      Login the web based platform http://appinventor.mit.edu and create a project called BMIcalculation.

B.      Design the layout of your apps in App Designer.

Ø   You have to use at least 2 textboxs, 2 horizontalarrangement, 2 labels and 1 button.

Ø   Rename the ‘Textbox1’ and ‘Textbox2’ as ‘Textboxheight’ and ‘Textboxweight’.

Ø   Rename ‘Button1’ as ‘ButtonCalculate’

Ø   Rename ‘Label1’ and 'Label2' as ‘LabelR1’ and 'LabelR2'

Ø   Change the properties of the component as follows:

Component.properties

Value

Screen1.Title

Calculate your BMI

HorizontalArrangement1.width

Fill parent

TextboxWeight.Hint

TextboxWeight.Width

TextboxWeight.NumbersOnly

Enter your weight (in kg)

Fill parent

True ()

TextboxHeight.Hint

TextboxWeight.Width

TextboxHeight.NumbersOnly

Enter your height (in m)

Fill parent

True ()

ButtonCalculate.text

Calculate

LabelR1.text

Your BMI is

LabelR2.text

???



C.      Build your program with Block Builder. Drag the following blocks and build your program.

Ø   From my blocks 

Ø   From build-in - Maths 

D.     Test your apps with emulator

Ø   Start the emulator and unlock the emulated phone.

Ø   Click ‘connect to device’

E.      Package the phone apps for submission

Ø   Click ‘Package for phone’ and ‘Downloads to this computer’

Ø   Submit the Downloaded file in eclass.

Video 1: Design your Layout

YouTube Video

Video 2: Programming using Block Editor

YouTube Video


Solution of the apps:


Extension activities

1.          The normal BMI range depends on age. For adult, 18.5 – 25 is normal.

2.          Using the if..then..else control structure, change the label.color or label.text according to the values calculated. You can add a label for this functions.

3.          You can also displayed different image according to the BMI value.

Suggested answer of extension activities

Subpages (3): Topic 2 - Ex1 Video 1 Video 2
Ċ
T. Chan,
Oct 9, 2012, 7:39 PM
Comments