Chapter 2 Simplify The Android User Interface Objectives

Chapter 2: Simplify! The Android User Interface

Objectives In this chapter, you learn to: • Develop a user interface using the Text. View, Image. View, 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 Android Boot Camp for Developers using Java 2

Objectives (continued) • Write code using the on. Create method • Display content using the set. Content. View command • Open a second screen using a Button event handler • Use an On. Click. Listener to detect user interaction • Launch a second screen using a start. Activity method • Correct errors in Java code • Run the completed app in the emulator Android Boot Camp for Developers using Java 3

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 Android Boot Camp for Developers using Java 4

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 Android Boot Camp for Developers using Java 5

Using the Android User Interface (cont’d) Figure 2 -5 Linear layout with a vertical orientation (default) Android Boot Camp for Developers using Java 6

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 Android Boot Camp for Developers using Java 7

Using the Android User Interface (cont’d) Figure 2 -6 Linear layout with a horizontal orientation Android Boot Camp for Developers using Java 8

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 Table 2 -1 Measurements used for the Text size property Android Boot Camp for Developers using Java 9

Using the Android User Interface (cont’d) Figure 2 -10 Updated text Property Android Boot Camp for Developers using Java 10

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) Android Boot Camp for Developers using Java 11

Using the Android User Interface (cont’d) • Adding an Image. View Control – An Image. View 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) – Toggle. Button (buttons that can be on or off) – Image. Button (buttons that have a picture on them) Android Boot Camp for Developers using Java 12

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 Android Boot Camp for Developers using Java 13

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 Android Boot Camp for Developers using Java 14

Creating Activities (continued) Figure 2 -17 Creating the Recipe class Android Boot Camp for Developers using Java 15

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 Android Boot Camp for Developers using Java 16

The Android Manifest File (continued) Figure 2 -22 Adding the Recipe Activity Android Boot Camp for Developers using Java 17

Coding the Java Activity – A method is a set of Java statements that can be included inside a Java class – Methods perform specific tasks • Coding an on. Create Method public void on. Create(Bundle saved. Instance. State) { super. on. Create(saved. Instance. State); } – Note the use of Curly braces { that begin and end the method code and the use of the semi-colon ; – Set. Content. View(R. layout. main); is added to display the screen Android Boot Camp for Developers using Java 18

Coding the Java Activity (continued) • Displaying the User Interface Figure 2 -24 Main. java code Android Boot Camp for Developers using Java 19

Coding the Java Activity (continued) Figure 2 -25 on. Create methods Figure 2 -26 Inserting the on. Create method Android Boot Camp for Developers using Java 20

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 • on. Click. Listener() method to await the button click action • on. Click() method to respond to the click event Code Syntax: Button b=(Button)find. View. By. Id(R. id. btn. Recipe); Android Boot Camp for Developers using Java 21

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. set. On. Click. Listener(new On. Click. Listener() { public void on. Click(View v) { // TODO Auto-generated method stub } }); Android Boot Camp for Developers using Java 22

Coding the Java Activity (continued) • Coding a Button Event Handler Figure 2 -30 Complete Code Android Boot Camp for Developers using Java 23

Coding the Java Activity (continued) • Correcting Errors in Code Figure 2 -31 Syntax Error Android Boot Camp for Developers using Java 24

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 Android Boot Camp for Developers using Java 25

Summary • Linear layouts arrange screen components in a vertical column or horizontal row • Relative layouts arrange components freely on the screen • Text Property and Text. Size property are used when creating text • To display graphics (pictures and icons), use the Image. View control • An Activity is when the app makes contact with the user and is a core component of the app Android Boot Camp for Developers using Java 26

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 on. Create method initializes an Activity Android Boot Camp for Developers using Java 27

Summary (continued) • The set. Content. View 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 start. Activity() 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 Android Boot Camp for Developers using Java 28