The Android User

quaintmayoMobile - Wireless

Dec 10, 2013 (3 years and 4 months ago)

64 views

Chapter 2:
Simplify!
The Android User
Interface

Objectives

In this chapter, you learn to:


Develop a user interface using the TextView,
ImageView, and Button controls


Create an Android project that includes a Button
event


Select a Linear of Relative layout for the user
interface


Create multiple Android Activities


Add activities to the Android Manifest file


Add a Java class file


2

Android Boot Camp for Developers using Java

Objectives
(continued)


Write code using the onCreate method


Display content using the setContentView
command


Open a second screen using a Button event
handler


Use an OnClickListener to detect user interaction


Launch a second screen using a startActivity
method


Correct errors in Java code


Run the completed app in the emulator

3

Android Boot Camp for Developers using Java

Designing an Android App


Designing apps is like constructing a building



The Big Picture


Follow these steps:


Create the user interface for every screen


Create an Activity for every screen


Update the Android Manifest file


Code each Java class with objects and actions



4

Android Boot Camp for Developers using Java

Using the Android User Interface


The interface is a window on the screen of any
mobile device


The layout is designed with XML code


Special Android
-
formatted XML code is extremely
compact


Linear Layouts and Relative Layouts


A
Linear Layout
organizes layout components in a
vertical column or horizontal row


Objects are placed directly below each other


Can be switched from vertical to horizontal orientation


Linear layout is the default layout

5

Android Boot Camp for Developers using Java

Using the Android User Interface
(cont’d)

6

Android Boot Camp for Developers using Java

Figure 2
-
5 Linear layout with a vertical orientation (default)

Using the Android User Interface
(cont’d)


A
Relative Layout
organizes layout components in
relation to each other


Provides more flexibility in positioning than Linear
layouts


Must be changed from the linear default

7

Android Boot Camp for Developers using Java

Using the Android User Interface
(cont’d)

8

Android Boot Camp for Developers using Java

Figure 2
-
6 Linear layout with a horizontal orientation

Using the Android User Interface
(cont’d)


Android Text Properties


Text Property


changes the text written in the
control


Text Size Property
-

can be adjusted in inches,
millimeters, pixels, density
-
independent pixels, and
scaled
-
independent pixels


9

Android Boot Camp for Developers using Java

Table 2
-
1 Measurements used for the Text size property

Using the Android User Interface
(cont’d)

10

Android Boot Camp for Developers using Java

Figure 2
-
10 Updated text Property

Using the Android User Interface
(cont’d)


Adding a File to the Resources Folder


Before you can use images, they must be placed in
the resources folder


Res folder contains three subfolders


All folder names begin with
drawable


hdpi (resources for high
-
density screens)


mdpi (resources for medium
-
density screens)


ldpi (resources for low
-
density screens)


Android supports three graphic formats


.png (preferred), .jpg (acceptable), .gif(discouraged)


11

Android Boot Camp for Developers using Java

Using the Android User Interface
(cont’d)


Adding an ImageView Control


An
ImageView control
displays icons or graphics on
the Android screen


Adding a Button Control


There are three types of Buttons


Button (buttons that perform a function)


ToggleButton (buttons that can be on or off)


ImageButton (buttons that have a picture on them)


12

Android Boot Camp for Developers using Java

Using the Android User Interface
(cont’d)


Planning a Program


Gather and analyze program requirements


Design the user interface


Design the program processing objects


Code the program


Test the program

13

Android Boot Camp for Developers using Java

Creating Activities


Each screen is considered an
activity


Constructed using XML layout files and a Java class


Creating an XML Layout file


All layout files are placed in the res/layout directory


Adding a Class File


A
class

describes a group of objects and serves as a
blueprint, or template, for creating those objects


An
object

is a specific, concrete instance of a class


When you create an object, you
instantiate

it; meaning
you define one particular variation of the object

14

Android Boot Camp for Developers using Java

Creating Activities
(continued)

15

Android Boot Camp for Developers using Java

Figure 2
-
17 Creating the Recipe class

The Android Manifest File


The
Android Manifest
file contains:


the name of the Java application


a listing of each activity


permissions needed to access other Android functions
(like accessing the Internet)


the minimum level of the Android APL


Adding an Activity to the Android Manifest


When applications have more than one activity, the
Manifest must have an intent to navigate among
multiple activities

16

Android Boot Camp for Developers using Java

The Android Manifest File
(continued)

17

Android Boot Camp for Developers using Java

Figure 2
-
22 Adding the Recipe Activity

Coding the Java Activity

18

Android Boot Camp for Developers using Java


A
method

is a set of Java statements that can be
included inside a Java class


Methods perform specific tasks


Coding an onCreate Method


public void
onCreate(Bundle savedInstanceState) {



super
.onCreate(savedInstanceState);


}


Note the use of Curly braces

{
that begin and end
the method code and the use of the semi
-
colon ;


SetContentView(R.layout.main);
is added to display
the screen


Coding the Java Activity
(continued)


Displaying the User Interface


19

Android Boot Camp for Developers using Java

Figure 2
-
24 Main.java code

Coding the Java Activity
(continued)

20

Android Boot Camp for Developers using Java

Figure 2
-
25 onCreate methods

Figure 2
-
26 Inserting the onCreate method

Coding the Java Activity
(continued)


Creating a Button Event Handler


An
event handler
is part of a program coded to
respond to a specific event


Tapping the button is called a click event


Java code must contain the following sections


Class property to hold a reference to the Button object


onClickListener() method to await the button click
action


onClick() method to respond to the click event

Code Syntax:

Button b=(Button)findViewById(R.id.btnRecipe);

21

Android Boot Camp for Developers using Java

Coding the Java Activity
(continued)


When you
import
the Button type as an Android
widget, the button package becomes available
throughout the app


An
import statement
makes more Java functions
available to your app


A
stub

is a code placeholder module

b.setOnClickListener(new OnClickListener() {

public void onClick(View v) {

// TODO Auto
-
generated method stub

}

});

22

Android Boot Camp for Developers using Java

Coding the Java Activity
(continued)


Coding a Button Event Handler


23

Android Boot Camp for Developers using Java

Figure 2
-
30 Complete Code

Coding the Java Activity
(continued)


Correcting Errors in Code


24

Android Boot Camp for Developers using Java

Figure 2
-
31 Syntax Error

Coding the Java Activity
(continued)


Saving and Running the Application


Testing the App automatically saves it


The Save All button will save the project


Select Android Application from the dialog window
the first time an app runs


25

Android Boot Camp for Developers using Java

Summary


Linear layouts arrange screen components in a
vertical column or horizontal row


Relative layouts arrange components freely on the
screen


Text Property and TextSize property are used
when creating text


To display graphics (pictures and icons), use the
ImageView control


An Activity is when the app makes contact with the
user and is a core component of the app

26

Android Boot Camp for Developers using Java

Summary
(continued)


Each screen in your app is an Activity


Every app has an Android Manifest file containing
the name if the app and a list of each activity


When an app has more than one activity, it must
have an intent so the app can navigate among
multiple activities


A method is a set of Java statements included in a
Java class


The onCreate method initializes an Activity

27

Android Boot Camp for Developers using Java

Summary
(continued)


The setContentView command displays the content
on the screen


Tapping or clicking a button invokes the event
listener and runs the code in that button


Use the startActivity() method to start an Activity in
an app that has multiple Activities


The intent contains a context
-

initiating Activity
class is making the request
-

and the name of the
Activity


Red error icons and red curly lines indicate errors

28

Android Boot Camp for Developers using Java