Home > Articles > Mobile Application Development & Programming

  • Print
  • + Share This
This chapter is from the book

3.3 Technologies Overview

This section introduces the IDE and Android features you’ll use to build the Tip Calculator app. We assume that you’re already familiar with Java object-oriented programming—we present Java in our book Java SE 8 for Programmers (http://bit.ly/JavaSE8FP). You’ll

  • use various Android classes to create objects
  • call methods on classes and objects
  • define and call your own methods
  • use inheritance to create a class that defines the Tip Calculator’s functionality and
  • use event handling, anonymous inner classes and interfaces to process the user’s GUI interactions.

3.3.1 Class Activity

Android apps have four types of executable components—activities, services, content providers and broadcast receivers. In this chapter, we’ll discuss activities, which are defined as subclasses of Activity (package android.app). An app can have many activities, one of which is the first you see after launching the app. You interact with an Activity through views—GUI components that inherit from class View (package android.view).

Before Android 3.0, a separate Activity was typically associated with each screen of an app. As you’ll see, starting in Chapter 4, an Activity can manage multiple Fragments. On a phone, each Fragment typically occupies the entire screen and the Activity switches between the Fragments, based on user interactions. On a tablet, activities typically display multiple Fragments per screen to take advantage of the larger screen size.

3.3.2 Activity Lifecycle Methods

Throughout its life, an Activity can be in one of several statesactive (i.e., running), paused or stopped. The Activity transitions between these states in response to various events:

  • An active Activity is visible on the screen and “has the focus”—that is, it’s in the foreground. You can interact with the Activity currently in the foreground.
  • A paused Activity is visible on the screen but does not have the focus—such as when an alert dialog is displayed. You cannot interact with the paused activity until it becomes active—for example, after the user dismisses an alert dialog.
  • A stopped activity is not visible on the screen—it’s in the background and is likely to be killed by the system when its memory is needed. An Activity is stopped when another Activity enters the foreground and becomes active. For example, when you answer a phone call, the phone app becomes active and the app you previously were using is stopped.

As an Activity transitions among these states, the Android runtime calls various Activity lifecycle methods—all of which are defined by the Activity class in package android.app. You’ll override the onCreate method in every activity. This method is called by the Android runtime when an Activity is starting—that is, when its GUI is about to be displayed so you can interact with the Activity. Other lifecycle methods include onStart, onPause, onRestart, onResume, onStop and onDestroy. We’ll discuss most of these in later chapters. Each activity lifecycle method you override must call the superclass’s version; otherwise, an exception will occur. This is required because each lifecycle method in superclass Activity contains code that must execute in addition to the code you define in your overridden lifecycle methods. For more on the Activity lifecycle see

      http://developer.android.com/reference/android/app/Activity.html    

3.3.3 AppCompat Library and Class AppCompatActivity

A big challenge developers face when using new Android features is backward compatibility with earlier Android platforms. Google now introduces many new Android features via the Android Support Library—a set of libraries that enable you to use newer Android features in apps targeting current and past Android platforms.

One such library is the AppCompat library, which enables apps to provide an app bar (formerly called an action bar) and more on devices running Android 2.1 (API 7) and higher—app bars were originally introduced in Android 3.0 (API 11). Android Studio’s app templates have been updated to use the AppCompat library, enabling the new apps you create to run on almost all Android devices.

Android Studio’s Empty Activity app template defines the app’s MainActivity class as a subclass of AppCompatActivity (package android.support.v7.app)—an indirect subclass of Activity that supports using newer Android features in apps running on current and older Android platforms.

For more details on Android Support Libraries, including when to use them and how to set them up, visit:

    http://developer.android.com/tools/support-library    

3.3.4 Arranging Views with a GridLayout

Recall that you arrange a GUI’s views in layouts. We’ll use a GridLayout (package android.widget) to arrange views into cells in a rectangular grid. Cells can occupy multiple rows and columns, allowing for complex layouts. Normally, GridLayout requires API level 14 or higher. However, the Android Support Library provides alternate versions of GridLayout and many other views and layouts so that you can use them in older Android versions. For more information on this library and how to use it in your apps, visit

    http://developer.android.com/tools/support-library/index.html    

We’ll cover more layouts and views in later chapters—for a complete list, visit

    http://developer.android.com/reference/android/widget/package-summary.html    

3.3.5 Creating and Customizing the GUI with the Layout Editor and the Component Tree and Properties Windows

You’ll create TextViews, an EditText and a SeekBar using the layout editor (that you used in Chapter 2) and Component Tree window, then customize them with the IDE’s Properties window.

An EditText—often called a text box or text field in other GUI technologies—is a subclass of TextView (presented in Chapter 2) that can display text and accept text input from the user. You’ll specify an EditText for numeric input, allow users to enter only digits and restrict the maximum number of digits that can be entered.

A SeekBar represents an integer in the range 0–100 by default and allows the user to select a number in that range by moving the SeekBar’s thumb. You’ll customize the SeekBar so the user can choose a tip percentage from the more limited range 0 to 30.

3.3.6 Formatting Numbers as Locale-Specific Currency and Percentage Strings

You’ll use class NumberFormat (package java.text) to create locale-specific currency and percentage strings—an important part of internationalizing your apps. You also can add accessibility strings and internationalize the app’s other text using the techniques you learned in Sections 2.7–2.8.

3.3.7 Implementing Interface TextWatcher for Handling EditText Text Changes

To respond to events when the user changes the text in this app’s EditText, you’ll use an anonymous inner class to implement the TextWatcher interface (from package android.text). In particular, you’ll use method onTextChanged to display the currency-formatted bill amount and to calculate the tip and total as the user enters each digit. If you’re not familiar with anonymous inner classes, visit

    http://bit.ly/AnonymousInnerClasses    

3.3.8 Implementing Interface OnSeekBarChangeListener for Handling SeekBar Thumb Position Changes

You’ll use another anonymous inner class to implement the SeekBar.OnSeekBarChangeListener interface (from package android.widget) to respond to the user moving the SeekBar’s thumb. In particular, you’ll use method onProgressChanged to display the selected tip percentage and to calculate the tip and total as the user moves the SeekBar’s thumb.

3.3.9 Material Themes

A theme gives an app a look-and-feel that’s consistent with Android. Projects that you create for Android 5 and higher use themes that adhere to Google’s material design guidelines. There are several predefined material design themes:

  • The “light” theme has a white app bar, a white app background and text that is black or shades of dark gray.
  • The “light” theme with a dark app bar is the same as above, but the app bar is black with white text by default.
  • The “dark” has a black app bar, a dark gray app background and text that is white or shades of light gray.

For each of these themes, there is

  • a Theme.Material version (e.g., Theme.Material.Light) for apps that do not use any AppCompat libraries and run on Android 5 and higher, and
  • a Theme.AppCompat version (e.g., Theme.AppCompat.Light) for apps that use AppCompat libraries and run on Android 2.1 and higher.

When designing a GUI, you can choose from the predefined themes, or even create your own new ones. For this chapter, we’ll use Theme.AppCompat.Light.DarkActionBar, which is the default theme in Android Studio’s app templates. Apps that use the AppCompat libraries must use one of the AppCompat themes; otherwise, some views will not render correctly. For more information about each theme and to see sample screen captures, visit

    http://www.google.com/design/spec/style/color.html#color-themes    
    http://developer.android.com/training/material/theme.html    

3.3.10 Material Design: Elevation and Shadows

Google’s material design guidelines recommend that objects in your user interfaces cast shadows just as real-world objects do. When you set a view’s elevation property, Android automatically casts a shadow for that view. Larger elevation values result in more pronounced shadows. For this app, we’ll set the elevation of the blue and orange TextViews that display monetary amounts.

The material design guidelines contain elevation recommendations for various on-screen components—for example, a dialog’s recommended elevation is 24dp and a menu’s is 8dp. For other recommended elevations, see:

    http://www.google.com/design/spec/what-is-material/elevation-shadows.html    

3.3.11 Material Design: Colors

App developers often customize a theme’s colors to match a company’s branding. If you need to customize theme colors, Google’s material design guidelines for color1 recommend that you choose a color palette consisting of a primary color—with no more than three hues (shades)—and an accent color. The primary colors typically are used to color the status bar and the app bar at the top of the screen and also can be used in your GUI. The accent color is used to tint various views in your GUI, such as SeekBars, CheckBoxes and RadioButtons. Once you choose a palette, you can use Android Studio’s Theme Editor (Section 3.5.2) to modify a theme’s colors.

You can find recommended sample color swatches from the material design color palette at

    http://www.google.com/design/spec/style/color.html#color-color-palette    

For palette color recommendations, visit

    http://www.materialpalette.com/    

This site enables you to click two colors from Google’s material design color palette, then it recommends three shades of the primary color, one secondary color and colors for your app’s text and icons.

In this app, we’ll use color swatches displayed in the Android Studio Theme Editor to select

  • a blue primary color for app bar’s background color
  • a darker blue dark primary color for the status bar that appears above the app bar, and
  • an orange accent color used to tint the SeekBar.

For the amount TextView’s light blue color and the tip and total TextViews’ light orange color, we used Google’s material design color palette to choose lighter shades of the primary and accent colors.

3.3.12 AndroidManifest.xml

The AndroidManifest.xml file is created by the IDE when you create a new app project. This file contains many of the settings that you specify in the Create New Project dialog—the app’s name, package name and Activity name(s) and more. You’ll edit this file’s XML to add a new setting that forces the soft keyboard to be displayed when the app begins executing. You’ll also specify that the app supports only portrait orientation—that is, the device’s longer dimension is vertical.

3.3.13 Searching in the Properties Window

The Properties window allows you to search for properties by their names or portions of their names, which can help you find and set properties faster. To do so, click the Properties window’s title bar and begin typing. At the top of the property list, a Search for tooltip appears showing what you’ve typed so far, and Android Studio highlights parts of every property name in the list that matches all or part of what you’ve typed. Then you can scroll through the list looking at the property names containing highlights.

The window will also scroll to the specific property that best matches what you type. For example, when searching a TextView’s properties, if you type "text co" or "textco", the Properties window will highlight portions of many properties, but it specifically scrolls to and highlights the textColor property.

  • + Share This
  • 🔖 Save To Your Account