Вы находитесь на странице: 1из 21

“Introduction to Mobile Application Development Using Android”

Week One Video Lectures

Week one: Android Overview


Lecture 1: Overview
Unit 1: Android Overview

Let me give you a quick overview of the Android platform.

The Android platform is a software stack that is designed to run on mobile devices. It can
simply be viewed as consisting of three layers.

At the bottom, the Linux kernel deals with the underlying hardware and exposes an
appropriate functionality for the higher layers to make use of.
On top of the Linux kernel is the middleware, this is where the Android framework exists and
this provides the appropriate functionality for applications to make use of the underlying
system. On top of this, we have the application layer. This is where typical users experience the
Android platform in terms of making use of all the apps that are installed on their devices.

In addition, developers are working at this layer to develop various applications, taking
advantage of the functionality provided by the underlying Android framework.

Android has been an evolving platform since 2008. Every so often, there is a new version of
Android platform released for the users. The latest version of Android platform is Lollipop.
Now, in the literature, you often see Android being referred to in one of three different ways—
either by the name of the platform, or the version number, or the API level.

The typical name of the Android platform is a user understandable name, like Ice Cream
Sandwich, Jelly Bean, Kitkat, or Lollipop.

A second way by which we refer to the platform is specifying the version number. The current
version of Android, Lollipop, is version number 5.0. The minor numbers represent small
enhancements to the platform.

The third way we often see Android being referred to is by the API level. This is what you would
see being used when you do the application development. The API level, for example, for Ice
Cream Sandwich, is 14 or 15 all the way up to Lollipop, which is 21 or 22.

If you have been following the news, you would see that the M developer preview has just
been released and it'll be the next upcoming version of Android.
When we look at their current distribution of Android devices, most of the Android devices in
use are running either Jelly Bean or Kitkat version. We do have a small fraction of Ice Cream
Sandwich and Gingerbread devices.

The Lollipop version is slowly gaining ground. And if you are developing an Android
application, it would be safe for you to target platforms as low as Ice Cream Sandwich or
Gingerbread, whereby you will cover most of the Android devices that are active at this
moment.

Week one: Android Overview 1


Week 1: Introduction to Mobile Application Development Using Android 1
Now let's view the Android architecture itself in more detail.

As we saw earlier, the Android platform can be viewed as several layers. So, we'll examine
these in a bit more detail.

At the top, a layer called the Android applications. This is where you have the standard
applications that come with your platform and also applications that developers release for
the platform. Android applications are written in the Java programming language.

Right below the applications layer is the Android application framework. This is the layer that
consists of various managers--like the notification manager, window activity manager,
telephony and resource managers-- and content providers, which deal with the underlying
data storage and the view system that deals with the user interface aspects of the Android
platform.

So, applications make use of the functionality exposed by the application framework
underneath.

Below this is the set of libraries that includes the Bionic libC, media framework for supporting
both audio and video, SQL lite for supporting databases, WebKit for browser support, openGL
for 3D graphics, and Surface Manager for 2D graphics and the view system.

In addition, at this layer, you'll also see the Android runtime. The runtime consists of the core
libraries that support the Java language and also the virtual machine, which in the current
version of Android, is defined as the ART, the Android Runtime.

Below that, of course, is the Linux kernel that provides the underlying drivers for the hardware
and also provides the hardware abstraction for the higher layers to make use of.

Now as we go forward, we have seen a basic introduction to the Android platform.

We'll go ahead and then develop our first Android application, which is the Hello World
application, in order to understand its development and the integrated development
environment.

Week 1: Introduction to Mobile Application Development Using Android 2


Week One: Android Overview
Exercise 1: Exercise Hello, World! App
Unit 2: Exercise Hello, World! App

Let us now examine how we can implement a simple Hello, world! application using Android
Studio.

Once you start up Android Studio, click on start a new Android Studio project. And when the
new project window opens up, for the application name, type in Hello, world! and the company
domain name.

For this course, we're going to use com107x.cse.ust.hk. You are welcome to use a different
name if you are developing other applications, but for this course we're going to use this as the
standard for all of the students.

For the project location, you can choose an appropriate directory where you go to store all the
projects for this course. So, in my case, I have chosen this particular project location. And then
once you fill those in, you can click on Next. And for the target Android devices, I'll select the
phone and tablet and then select the minimum SDK to be API 21, which is Android Lollipop.
And click on Next.

Now, of course, you can select a lower level SDK if you would like to, but for this course, we
will-- for the initial examples -- stay with the minimum SDK as API 21. And then hit Next.

In the next window, we'll select the blank activity as the standard template and then hit Next.
And then for the activity name we'll retain the default values here.

If you would like to give a separate-- different name for your activity, you can type in the
information here-- as appropriate-- and then hit the Finish button here. And then wait for the
Gradle build to process the template and then open the new Android project in Android
Studio. Once the project is ready, this is what you will see at the end.

If you have installed the M Android developer preview, you might see something like this on
the screen. Just go ahead and switch the rendering value to, for example, API 21. And then you
should be able to see the screen of your application being displayed here. This completes the
Hello, world! application setup.

Week 1: Introduction to Mobile Application Development Using Android 3


Week one: Android Overview
Lecture 2: App Development Process
Unit 1: Create an Android Virtual Device (AVD)

To create a new Android Virtual Device, either you can select Tools->Android and the AVD
manager, or you can click on this icon here called AVD Manager. And then when this window
opens up, click on Create a New Virtual Device.

You can select, for example, a phone, a Nexus 5, and hit Next. And we will install a Lollipop 21
Version with x86_64. So, let me select that. And then hit on Next. And you can leave the
standard values as is.

If you're running it on a slow computer with less amount of memory, you can go into the
Advanced Settings and then make some changes to the size of the memory that your device is
going to use. OK. And then once you're done, hit Finish.

And then at this point, you would see this window pop up with the virtual device that you just
created.

You can go ahead and start this emulator by clicking on the Play button here to launch this
AVD on the screen.

Week 1: Introduction to Mobile Application Development Using Android 4


Week one: Android Overview
Lecture 2: App Development Process
Unit 3: Run the App

Now that we have finished configuring the Hello world application, let's see how we can deploy
this application and run it either on the emulator or on a real device.

In order to deploy the application to the emulator or real device, you just click on Run, and
then select Run App. Or you can click on the Run button in the tool bar.

Once you do that, Gradle will prepare the application and then come up with a window like
this. And if no device is currently active, then it'll enable you to either launch an emulator.
So, let's go ahead and launch the emulator.

Once you launch the emulator, it will take a few minutes for the emulator to get ready to run
your application. Once the emulator window opens and gets ready, you will see this screen.

And then you can go ahead and then unlock the screen, and then see the Hello, world
application running on the device or on the emulator.

If you already have your emulator running, or you connect a device to your computer, and
then click on the Run button, then when the window shows up, it will list all the devices-- or the
emulators-- that are available for you to deploy your application.

Consequently, in this case I have the emulator running. Thus, when I click on OK, that app gets
deployed to my emulator, as you see on the right side. So, this is the procedure for deploying
and running your application, either on the emulator or on a real device.

Week 1: Introduction to Mobile Application Development Using Android 5


Week one: Android Overview
Lecture 3: App Fundamentals
Unit 1: Android App Fundamentals

Now that we have completed the Hello World application and seen it running, either on the
emulator or on a real device, let's go ahead and examine this application in a bit more detail in
order to understand some aspects about Android applications.

As we have already realized, Android applications are all written in the Java programming
language. Android Studio then compiles the Java code along with the data and resources that
you supply for your application, and then prepares a package called as the apk package.

This is what you install on a real device or on an emulator.


Of course, when you download applications from the Play Store, this is automatically done for
you. So essentially, it involves downloading this apk package and then installing it on your
device.

When you deploy your application from Android Studio, either to the emulator or to a real
device, it is exactly the same process. The apk package is pushed onto the device and then
installed on the device.

What does the apk package actually contain? It contains the compiled Java classes, which are
prepared from the Java code that you write together with resources and other data files that
you supply for your Android application.

We'll examine the remaining two, the resources and data files, later on as we go through the
course.

Let's now return to Android Studio and examine the Hello World application in a little more
detail.

In Android Studio, you will notice the user interface layout that you see corresponding to what
you see running on the real device. We'll examine this in a bit more detail in one of the later
sections.

Let's switch to the MainActivity.java tab, and then have a look at the source code being
displayed here.
Let's take a closer look at the Java code in MainActivity.java. As we examine this code, let me
draw your attention to two sections of the code.

First part, you notice that we are extending a class called as the Activity class here. And the
second part, you see that we are overriding certain methods inside this class here.

In particular, let me draw your attention to the fact that we are overriding a method called
onCreate method here. And we have a few lines of code inside the onCreate method. The
remaining part of the code, we will examine in one of the later exercise.

Now that you have had a closer look at the Java code, let's now go ahead and examine why we
subclass the Activity class and what exactly is the Activity class that we are subclassing in the
code.

Week 1: Introduction to Mobile Application Development Using Android 6


To explain it in a bit more detail, a typical Android application is composed of four basic
components; activities, services, broadcast receivers, and content providers.

Let me briefly summarize the four kinds of components that can form part of an Android
application.

Activities are typically dealing with the user interface part of your application. Services are
primarily used for doing background work on your behalf. Content providers are dealing with
data storage and exposing the data within your application to the remaining components or to
other applications. Broadcast receivers are used to deal with any events that need to be
delivered to your application.

This is a broad summary of these four components. As we go through the course, we will
examine some of these in more detail.

Let's, in particular, examine what an activity is. As I have just emphasized, an activity deals with
the user interface aspects of your Android application. Every screen that you see within your
application is controlled by an activity behind the scenes.

So how do you create an activity? You create an activity by extending the Activity base class.
And within this class, you will implement the appropriate code to create the user interface. And
the activity also deals with providing the ability for users to interact with your applications
We'll examine each of these in more detail in some of the later examples mentioned in this
course.

Typically, when you launch your Android application, you click on the icon corresponding to
your application.

Now essentially, what happens is that when you click on the icon, this results in a call into the
Android framework, which then goes ahead and creates the appropriate activity that displays
the user interface for your application.

Creating the activity involves the Android framework calling the onCreate method that you
implement within your Activity class. Hence, that is the reason why you see the onCreate
method in the code that we just examined a bit earlier.

Returning to the code again, you notice that, within the onCreate method, we are calling two
different methods here again. The first one is a call to the super class where you're passing a
Bundle there. Don't worry about what it is at this moment. We'll come to that in a later part.
The second statement that you see here is setContentView. And then, you are supplying
something called R. layout. activity_main.

This parameter supplies the layout of the user interface for your application. And so, when the
activity gets created, this particular layout will be put on the device's user interface. That is the
reason why you see the user interface being defined in another file called the layout file.

We will examine layout files in more detail in the following example.

Now that we have a basic understanding of an Android application, let's now go to the next
example where we will look at user interface widgets, layouts, and event listeners in more
detail.

Week 1: Introduction to Mobile Application Development Using Android 7


Week one: Android Overview
Lecture 4: Greet Friend App – Overview
Unit 1: Greet Friend App – Overview

Our first exercise in this course is called GreetFriend. This app will ask you for your friend's
name. And then type a greeting to your friend on the screen.

You can see the app running on the emulator screen here. In the space provided, you need to
type in your friend's name, let's say, John. And then when you click on the Greetings button, it'll
type out a greetings message for John on the screen saying Good Day, John!

Similarly, you can change the friend's name, and click on the Greeting button to display it with
the new friend's name. So, in this app, as you can see, you expect the user to supply and input.
You're able to read in the input that the user supplies. And then, subsequently, react when a
button is clicked by updating the user interface.

We will do this application in several stages.

In the first stage, we will look at how we can design the user interface for this application using
various Android UI Widgets. Subsequently, we will study on how we can activate the buttons.
And also read in the user's input by using the onClick listener for the button in order to
respond to user interactions with the interface.

We will then modify this app so that when you type in your friend's name and click on the
Greetings button, the app will then display the message on a different screen. This requires us
to implement two different activities and start the second activity from the first activity.

Finally, we will extend this app to display a list of friends. And when you select any one of those
friends, then the app will appropriately display the greetings message using that friend name.
This requires us to use the ListView Widget and the ListActivity within the application.

Week 1: Introduction to Mobile Application Development Using Android 8


Week one: Android Overview
Exercise 2: Exercise Greet Friend (Part 1)
Unit 2: Exercise Greet Friend (Part 1)

In the next exercise, we will learn how to import a pre-configured project into Android Studio.
Then we will see how we can make use of various user interface widgets in order to design the
user interface for an app called as a GreetFriend app.

The GreetFriend application will ask the user to type in his or her friend's name, and then,
when you click on a button, will display a greeting on the screen.

Once you download the zip file for your app to the directory where you keep all your Android
Studio projects, then go ahead and unzip the file. Once you have unzipped the file, start
Android Studio. And then click on Open an Existing Android Studio Project. In the folder
window that opens up, navigate to that folder where you stored the project. And then, select
the folder and choose. And we wait for the Gradle build to configure and deploy the project.

In case the project files are not opened, go to the left-hand side and click on the Project tab to
see your project open up. Hence, you can click on these triangles to open up the project
structure in more detail.

Once you have the project structure opened, go ahead and click on MainActivity.java to open
the file. Also open the resources folder under layout. And then open activity_main.xml. The
activity_main.xml file is the layout of the application.

So, at this moment, as you see, this layout is configured to simply show the "Hello World"
string on the screen.

Now let's see how we would go about constructing the user interface for this application.

Now that we have the activity_main.xml file open, let's go ahead and make some modifications
to this user interface by using several widgets to design the UI.

First and foremost, select the Hello World. So, when you single click on it, the widget gets
selected. This is a TextView widget that we are using on the screen. Let's double click on the
Hello World TextView. And when this window opens, we'll give an ID for this TextView as
textMessage. The reason why we give an ID to the UI widgets is so that we can reference them
in the Java code.

Let's now drag this Hello World TextView widget, and then, position it at the center of the
screen, as you see in the video here. Let's also increase the size of the text.

In order to change any of the properties of any UI widget, you can go to the Properties window
here, and then select the appropriate property, and make a change to that.

So, in order to increase the text size, we will go to the Properties window. And then, in the text
size property, let's type in 24sp. sp stands for scale independent pixels.

This is a way of specifying the size of any text that you use on the screen so that the text will
automatically adapt to different screen sizes and screen resolutions. So, once we do that, you
see that the text size has increased.

Week 1: Introduction to Mobile Application Development Using Android 9


The next step is to include a text field into the user interface. So, we'll go to this left side. We
see a palette of UI widgets.

Let's select a plain text, and then drag it onto the screen, as seen here. And then position it
right in the middle.

In addition, for this text field-- let's go ahead and adjust the layout width property of this text
field to match_parent. So, this way, the text field essentially occupies the entire width of the
screen.

In addition, for this TextView, let's type in a hint string for this TextView. So, go into the
Properties window in the hint string. Let's type in, "Type your friend's name here." So that'll
show up on the screen.

So, in addition to this text field, which in Android terms is referred to as an EditText widget,
let's give it an ID. The ID for this text widget would be editFriendName. Let's also add a button
to the user interface. So, we'll go back to the palette and drag in a button from the user
interface and then position it on the UI.

In addition, we can give this button an ID. So, let's call it greetButton. And the text would be
"greetings."

So now you see that your user interface has been designed with a TextView widget with an
EditText widget, which allows you to enter your friend's name and a button widget here.

So, what you would expect is that, when you click on the button, then the TextView will display
a greeting with your friend's name included in the greeting text.

To deploy and see how this application looks like on a Android device, let's run this application,
and then see it running on the emulator.

So, let's click the Run button in the toolbar. And when the window opens, we click on OK. And
you should see this app getting deployed to the user interface of your emulator.

So, let's type in a friend's name, for example. And then our expectation is that, when you click
on the Greetings button, you should see a greeting text being displayed on the screen.
Unfortunately, nothing happens at this moment because we have not yet enabled the
greetings button in code.

That will be the next step we'll see in the next exercise.

Week 1: Introduction to Mobile Application Development Using Android 10


Week one: Android Overview
Lecture 5: Android UI Basics
Unit 1: Android UI Basics

Now that we have completed the design of the user interface for the Great Friend application,
let's quickly review some of the aspects of Android user interface that we have encountered so
far.

So, what we have understood already is that every activity in Android is associated with a user
interface which in turn is specified in a layout file. And the layout file is supplied as a parameter
to the setContentView() method call inside the onCreate() method of the activity.

Going back to our main activity, our Java code, we see that the setContentView() is being called
inside the onCreate() method, and it is taking the parameter of the XML file, which is the
activity main product XML file.

Reviewing the XML layout that we just designed, we see that this user interface layout has
three widgets included in the layout.

The first one is a text view that displays the message.

The second one is an edit text view where you type in your friend's name, and the third one is
the button which the user clicks in order to display the greeting message to the friend.
We see that this user interface is composed of three different user interface widgets for this
example. These widgets are also referred to as views in Android.

To summarize, what we have understood so far is that the user interface is built using views.

Now, in addition, these views can be enclosed inside viewgroup objects, which we will review in
a short while.

The views are the base class for widgets, like the Textviews, the EditText, and the Buttons that
we use in our UI design. These views can then be enclosed inside viewgroups which allow you
to do layouts for your user interface.

We will encounter some of them in more detail as we go through the several examples in this
course.

The views and the viewgroups that comprise the user interface for an Android application can
be organized into a tree-structured hierarchy as shown in the figure on the right side.

So, we might have on the top level a viewgroup which encloses other viewgroups and views
down below, and viewgroups, in turn, may be composed of a group of views that form this
viewgroup.

Returning to our UI design, we see that this representation of the user interface for the Great
Friend application shows us the design view. Now we can switch to the text view of the user
interface where the same UI is represented using XML format. This explains the reason the
layout files are XML formatted files.

So, within this XML file, you'll see the three different views being described here.

Week 1: Introduction to Mobile Application Development Using Android 11


In addition, for each of these views, they have certain properties being set up in XML. These
three views are then enclosed inside a viewgroup, which is the relative layout. The layout files
are enclosed inside the layout subfolder of the resources folder, as you see in this folder
hierarchy for your project.

Returning to the UI design, we see that the UI is defined in the layout file, which is in the
resources folder. There are two ways to view the layout, as we have seen for the example.

One of these two ways is the visual view, which is accessible through the design tab of your
XML layout, and the other is the XML code view, which you can access using the text tab of
your layout file.

Inside the XML representation, we see that the widgets have been given IDs, for example, the
text view has been given an ID as a text message. The reason for giving IDs to these widgets is
so that we can reference them within the Java code. For example, the text view being
referenced as R.id. text Message.

That completes our discussion on building the user interface.

So, we'll go off to the next example where we will learn how to identify and respond to user
interaction within the UI., event listeners in particular. We'll also review resources in bit more
detail in that section.

Week 1: Introduction to Mobile Application Development Using Android 12


Week one: Android Overview
Exercise 3: Exercise Greet Friend (Part 2)
Unit 2: Exercise Greet Friend (Part 2)

In this part of the exercise, we will see how we will activate the button in the code and how the
application will respond when the user clicks on the button.

So, in order to do that, let's go back to our main activity Java file where we need references to
the UI widgets on the screen.

First and foremost, let me introduce a variable to hold the reference to the button on the
screen. So, I type in Button and greetButton. Now, in case Android Studio is unable to resolve a
symbol that you type in, then it'll show up in red color.

Very often, this requires you to import certain libraries. In order to do so, put your cursor on
the screen and then import the appropriate library. For a Mac, you hold the option and hit the
Return. And for a Windows device, you would be holding down the Alt and Return key OK.

Once we have the reference, then in the onCreate method, we get a reference to the greet
button on the user interface. In order to do so, let me type in the code.

Whenever you reference a UI widget in code, you would see this standard pattern being used
for these widgets. you would also see the variable name followed by a casting of the
subsequent code by specifying the appropriate UI widget type, which in this case, is a Button.
And then we would say findViewById.

Now, fortunately in Android Studio, as you type, it comes up with suggestions. Very often it is
valuable to make use of such suggestions to complete the code so that you won't be typing in
errors within the code.

Now, once you type in this findViewById, this is a way of getting a reference to a widget on the
user interface by specifying it using the ID of the widget.

Now, looking at this code, it becomes clearer why we gave IDs to those widgets on the user
interface. So that it becomes easier for us to reference them within the code. in this case, I
want to get a reference to the greetButton on the UI. So, I would type in R.ID.

And as you see, Android Studio comes up with suggestions of already existing IDs. Therefore,
it's a good practice to make use of these suggestions in order to avoid errors within your code.
And hence, you should type in R.id. greet Button.

If you need to reference any UI widget to which you have given an ID in the code, then the
standard way of referencing it is by specifying R.id. and the ID you give to that particular UI
widget.

In addition, we want to be able to activate this button by including appropriate code to


respond when the user clicks on it.

In the next step, I am going to set up an onClickListener for this greet button. I type in
onClickListener and then I would say this, i.e. I'm expecting this class to implement the on click

Week 1: Introduction to Mobile Application Development Using Android 13


listener. Once I complete this, you would notice that Android Studio comes up with a red-light
bulb on the left side.

Just click on that and then it'll make some suggestions for you on how we can resolve
problems encountered by Android Studio on this particular statement.

In this case, it says make main activity andimplement the listener. So, let's go ahead and select
that.

Now obviously, you can type in the code if you want to go directly, but I want to illustrate to
you how you can take the help of Android Studio to fill in some of the codes for you on your
behalf.

Now, very often, it is useful to take Android Studio help in order to avoid typing errors within
the code. Simple things as avoiding syntax errors that might creep into your code because you
forgot a semicolon somewhere or you forgot a closing paranthesis somewhere.

So, let me go ahead and make use of this window to insert the code. When I click on that, you
notice that automatically, the Android Studio has changed this line of code here to say
implements view onClickListener.

In addition, at the bottom, you see the method for onClick being-- this stub method for onClick
inserted into the code. Now we go into this stub method that has been inserted there and add
code in order to activate the button. So, to do that, let's go into this code. And very often, when
you go into it, one of the parameters coming again for the onClick method is the view.

This identifies which particular view on the UI has been clicked by the user. My typical way of
making use of this is that I would put a switch statement in here. And then I would say view
getId () to be able to identify which view has been clicked.

For example, in this case, which button has been clicked on. I notice that there's only a single
button on the user interface. So, I would type in this case R.id. greet Button.

This is one of the cases that I need to handle within the switch statement.

Normally, when I type in code, tend to fill in some of the skeleton code first before moving into
fill in the actual details. Now, in a switch statement, you always need to give a default which in
this case, we don't need to do. I don't wish to do anything except leaving it empty with a break
statement there.

Now, what we need to realize is that when the greet button is clicked on, we want to change
the text view that is displaying hello world. And change that to reflect the name of the friend
that has been clicked on.

Now, in this case, I will add in the code in order to reference the text view and edit text view.
So, let me get a reference to the textview field.The text view field will be named as text
message.

Again, you would notice the standard pattern that we use whenever we need to get a reference
to a view on the user interface. So, I would say find view by ID. Textview. Find view by ID. r.id.
And then text message. That's the name that I gave.

Week 1: Introduction to Mobile Application Development Using Android 14


Now, normally, when I write code, I tend to use names that are meaningful. And also, within the
code, when I introduce a variable, I will use the same name as the ID that I give to the view just
so that it's easy for me to track down what is going on.

Now, again, as you see, the text view is complaining with red color. So, I import the appropriate
library here. And then the other one that I want to be able to get a reference to is the edit text
field which was named as find view by ID r.id. editfriendname.

Now, why do I get a reference to the edit text field?

Now, I need this reference in order to extract the name that the user types in that field. And then
make use of it when I'm constructing the string for displaying the greeting message on the
screen. So, I get a reference to the edit text field. And then I would say now I want to be able to
extract the friend's name. Therefore, I would say string friend name. And from the edit friend
name, I would say get text. But when it returns the text, it'll return to as a character buffer. So, I
need to convert it to a string.
I would use the standard provisioning within Java to say get text to string. This will provide me
with the name of my friend I typed into the edit text field in the form of a string here.

I can now make use of this to construct the greeting string. So, let me go down into the switch
statement. And for the case when the greet button has been clicked, let me add in the code to
respond to the greet button.

Within this switch statement, it is indicating in case I drop into this part of the code, and it means
that the greet button must have been clicked by the user. So, to respond to that, I would type in
saying text message set text.

This is a way of changing the text that is being displayed on the UI within a text view. And this
is how you would change the text being displayed in the text field. So, I would say set text and
good day. And I will add in my friend name variable here.

If you want to be a bit clearer, you can add in spaces in there. Again, this is your preferred style
of writing code.

Now, we have typed in the code in here in order to display the greeting message to the user on
the user interface.

Now, within Android, very often when you use strings like these, Android Studio will come up
with a suggestion like a yellow bulb indicating to you that perhaps you may want to consider
an alternative way of specifying the string.

One reason we may want to use a string resource in order to specify these strings is because in
case we want to develop your app with a multilingual interface or targeting multiple languages,
you may want to replace that string with a different strange in a different language.

When you click on that yellow bulb there, it'll say extract string resource. And so, let's go ahead
and click on that. And it'll come up with a suggestion for you.

So, I would say greet string. In this window, I will type in a resource name from this as greet
string. And click on OK.

Week 1: Introduction to Mobile Application Development Using Android 15


In that case, you see that Android Studio has replaced that string there with get string r. string.
Greet string. Now, you must be wondering where this r. string. greetstring is stocked.

This is a good point for us to visit the resources folder to understand how we can make use of
resources within Android applications.

Now, when you go to the resources folder and open the values subfolder here, you would see
strings.XML file. Go ahead and click and open that strings.XML file. You'll see certain resources
being declared here.

In Android, this is one way of specifying string resources that you're going to use within the
code.

So, this is, for example, a collection of string resources-- earlier, we have already seen the use
of layout resource here.

Later on, we will come across other resources that are used within your Android application,
like drawables and menu resources and so on in more detail.

Now, the reason why we separate resources from the actual code is to ensure that if we need
to, we can simply update just the resources part without having to rewritethat code for our
application.

So, this completes the modification that we need to do to the main activity Java.

Now, let's go ahead and deploy this application on the emulator and see how it works in
practice. Once it completes building the project, it will pop up this window. And then let's go
ahead and select the emulator and click on OK, then you will see your application running on
the emulator's window.

Now, when you type in your friend's name, say-- and then click on the greetings button, you
would notice that the message has now been changed to Good day Jon.

Let's try one more friend's name. So, whenever you click on the greetings button, the textview
displaying the greetings message changes accordingly. This completes part two of the exercise.

Week 1: Introduction to Mobile Application Development Using Android 16


Week one: Android Overview
Lecture 6: Android Handling UI Events
Unit 1: Android Handling UI Events

For the greet friend example, we have seen how we will activate the greetings button by
including the appropriate handling code inside the main activity for Java 5.

Now handling of user interface events in Android requires you to implement appropriate UI
handling code in the activity that is designed to host this user interface.

Let's understand that a UI event is an action that is triggered by the user interacting with the
user interface.

For example, when you touch a button, select a check box, drag something on the screen,
press a key, or press the back button on your device, and so on, all these amount to user
interface events being caused for your application.

Now, if you are familiar with the event driven programming paradigm, it becomes very clear as
to how the implementation of the code proceeds. So, we have an event source which
generates the event.

As in the example of the button being touched, this event then has to be handled by
implementing an appropriate listener that will execute once that event occurs.

So, going back to our example, we see that we need to define the event listeners and associate
them with the different views that we include inside our Android user interface.

Getting back to our code, we saw that we have the greetings button, and when the user clicks
on the greetings button, we saw that we have implemented the way to get reference to the
greet button in the code.

And subsequently, we saw how we implemented the onClick listener for the greet button.
And inside the onClick listener, we are able to extract the information from the EditText field
and then use that to prepare an appropriate string and then display the string on the user
interface.

Now this onClick method is the event listener that we have implemented.

In addition, we have declared that the main activity will implement the onClick listener right
within the code.

And subsequently, we also specified that, for the greet button, the onClick listener is
implemented by the main activity.

There are other ways of specifying the listener. You can either specify the listener in code or
even specify the listener in the XML code of your activity layout file.

To summarize, what we have seen is that the view class, which is the class that is the super
class for all the different UI widgets, defines a Java interface that contains a single callback
method.

Week 1: Introduction to Mobile Application Development Using Android 17


When you define an activity that hosts a user interface, then, for all of the views that are
included in the activity's layout file, the activity will implement the interface callback method.

In this example, we saw that we have implemented the view onClick listener to be able to
respond to when the button is clicked by the user.

This is called by the Android framework when the view, to which the listener has been
registered, is triggered by the user interacting with that widget.

Therefore, when you click on the button, then the onClick listener corresponding to that button
will be invoked. Similarly, if you touch at a particular point of the screen, and if you've
implemented the onTouch method, then that method will be invoked by the Android
framework.

Within Android, several callback methods are available for a view class. These include onClick,
onLongClick, and so on. But, in particular, in the example that you just saw, we saw the use of
the onClick method for responding to the user interaction with the user interface.

We also saw a brief reference to the resources folder included within the Android project and
we also saw how the layout is enclosed inside the layout subfolder of the resources folder.

Now, the resources folder comprises of all the resources that your application is making use
of. What are resources?

Resources are additional files, or content, that you supply for your application. And these are
independent of the source code.

Now, the reason why we separate the code from the resources is that we can independently
update the resources without having to go and update the corresponding code.

And resources that are used within an application into the Layouts-- we have seen that,
already, we could include images, perhaps PNG or JPEG images that we've been included on
the user interface; menus, we will see menus in a more detail in one of the subsequent
exercises; strings, we saw how we make use of the strings.xml in order to store a string and
then use the string within the code.

And also, you will see launcher icons and animation related XML files being stored in the
resources folder. To emphasize again, separating the resources from the code to enable many
different things, including customizing the app for different devices.

So, for example, if you have an app that you designed for Android devices, it can automatically
adapt itself to different screen sizes, different sizes of the device-- for example, mobile phones,
or tablets, and so on.

In addition, your app could also adapt to different locales.

So, for example, a user is using an Android phone that is configured to use a language other
than English-- say, for example, French, German, Chinese, and so on.

Week 1: Introduction to Mobile Application Development Using Android 18


Then, within your code, if you include the strings specified in different languages, then your
user interface can appropriately adapt itself based on the interface language that the user is
using on his or her device.

Now we will not get into those details in this particular course. But there is sufficient
explanation on the Android Developers website for how you can customize your application
for different locales and different languages.

Now, when you access resources within your application, if you're accessing resources from
your Java code, you would normally specify your resources by identifying it as
R.resource_type.resource_id.

So, for example, we saw the use of R. layout. activity_main within the code. Similarly, when we
were specifying the text view we said R.id.text_message within the Java code.

You can also reference resources from within XML files that you include in the resources
folder. In such cases, then you will identify the resource by specifying @ and resource type
slash the resource ID. So, for example @string/greeting, @android: color/blue, and so on.

Going back to our main activity, we saw how we used a resource called R. string. Greet string in
here in order to prepare the message that is displayed on the screen.

Now, this R. string. Greet string refers to a string resource that we have stored in the string.xml
file. You have already seen how we do that in code in the previous lab exercise.

Now that we have completed the greet friend example, let's go ahead and do an assignment.
In this assignment, you will be modifying the greeting app and display a greeting based on the
time of the day.

The details are available to you in the assignment description on the course site.

Week 1: Introduction to Mobile Application Development Using Android 19


Week one: Android Overview
Assignment: Assignment Time Greet Friend
Unit 1: Description

In this assignment, you will be modifying the Greet Friend example to display a message based
upon the time of the day.

For example, if you type your friend's name in the morning time, it'll say good morning and the
friend's name. In the afternoon time, it'll say good afternoon. And in the evening time, it'll say
good evening. And at night, it should say goodnight.

Another example, at this moment, it's 4:36 in the afternoon. So, if I say, John, and this greeting
should display Good Afternoon, John in this moment.

The same application, when you run in the evening time, say around 7:30, 8:00 PM, it should
type out Good Evening, John at this moment. The same application, when you run it at night,
say around 11:40, it should say Goodnight, John. And the same application, when you run in
the morning at 7:45 AM, it should say Good Morning, John.

So now we'll start with the Greet Friend application and then modify it into a time Greet Friend
application which prints out the message based upon the time of the day.

Week 1: Introduction to Mobile Application Development Using Android 20


Week one: Android Overview
Assignment: Assignment Time Greet Friend
Unit 2: Video Instructions

When you began working on this assignment you downloaded the time GreetFriend.zip file
and imported the project into Android Studio.

We have already included some test code as part of this Android Studio project so that you can
carry out automated tests on your implementation of the solution for this assignment.

Let me now illustrate to you the steps involved in carrying out these automated tests.
Designing of these automated tests is beyond the scope of this course. And hence, we'll not
explain how the test code is actually designed.

You can find online material on how to design tests for Android applications.

Now, to carry out the automated tests for your assignment, once you have imported the
project in Android Studio, up here where you'll see this app. Once you click on that, you will see
Edit Configurations on the screen there. Then click on Edit Configurations. And when this
window opens up, click on this plus button here to add a new configuration.

When you click on this plus sign, you will see these options here. Click on Android Tests, then
type in Test for the name. And then for the module, choose App, and then click OK.

Now your project is ready for carrying out automated tests. In order to carry out the
automated tests, just click on the Run button.

Make sure that the emulator is already up and running at this stage; because these tests will
make use of the emulator to run the automated tests on your behalf.

Once you have completed the implementation of the solution for this assignment, you can
carry out this automated test to ensure that your solution meets the requirements. To carry
out the automated tests, click on the Run button here to run the tests. And when you do so, it
will take a little bit of time for Gradle to assemble the tests and then run them on your
emulator.

Once the tests have completed, if you click on the Run button, if everything goes well with your
tests, then you will see this screen being displayed.

This screen indicates that your application has passed all the tests. And so, you will see the
green bar to the right here.

As part of your submission, we would like you to do a screen capture of this screen and then
submit it. In case your solution does not pass the test, you will see this kind of a screen with
the bar in red color.

Now this is just an example of one of the possible problems that you might encounter if there
is an error within your solution.

Week 1: Introduction to Mobile Application Development Using Android 21

Вам также может понравиться