Block 5 Step-by-Step

Loading...

From the course by CentraleSupélec

Build Your First Android App (Project-Centered Course)

514 ratings

CentraleSupélec

Build Your First Android App (Project-Centered Course)

514 ratings

What you’ll achieve: In this project-centered course*, you’ll design, build, and distribute your own unique application for the Android mobile platform. We’ll provide you with a set of customizable building blocks that you can assemble to create many different types of apps, and that will help you become familiar with many important specificities of Android development. When you complete the project, in addition to having a personalized app that you can use and share, you’ll have the skills and background you need to move on to more advanced coursework in Android development. What you’ll need to get started: This project-centered course is designed for learners who have some prior experience programming in Java, such as an introductory college course or Coursera’s Java Programming Specialization (https://www.coursera.org/specializations/java-programming). You will need a computer with a stable Internet connection, but you will not need an Android phone - we’ll use free software that you can use to emulate a phone on your computer. We'll use Android Studio as IDE; it is compatible with most computer and operating systems. You can find detailed system requirements here: https://developer.android.com/sdk/index.html#Requirements. *About Project-Centered Courses: Project-centered courses are designed to help you complete a personally meaningful real-world project, with your instructor and a community of learners with similar goals providing guidance and suggestions along the way. By actively applying new concepts as you learn, you’ll master the course content more efficiently; you’ll also get a head start on using the skills you gain to make positive changes in your life and career. When you complete the course, you’ll have a finished project that you’ll be proud to use and share. Time: 10 hours of study, 10 hours of active project work

From the lesson

Toward Your Application, Step-By-Step

This module spans 2 weeks. This week, we walk you step by step in the development of 5 of the basic building blocks.

Block 5 Step-by-Step16:34

Meet the Instructors

Dr. Virginie Galtier
Associate Professor
Computer Science
Michel Ianotto
Associate Professor
Computer Science

In this video I'll show you how to save information on your phone during

an execution of your application, and how to retrieve it during the next execution.

I will be using the Block05 application as an example.

So, upon starting, this application presents a white background.

And when you click, for instance,

the magenta radio button, the background turns magenta.

And if you click blue, it turns blue.

If you close the application and execute it again,

the background is set to the last color that you've picked.

Start a new Android Studio project.

Call the application Block05.

Click Next.

Pick the API level 16.

Next, choose an empty activity.

Next.

And Finish.

I will start by building the graphical user interface.

Go to activity_main.xml.

Then get rid of the default "Hello World" TextView.

And drag a RadioGroup here.

So this RadioGroup will be named radioGroup_colors.

And next, we will add three buttons to this radio group.

The first button will read Blue, and

that will be our radioButton_blue.

The second button will let the user choose the magenta color.

Magenta.

RadioButton.

Magenta.

And the last one is for the yellow.

Yellow.

Let's change its id to radioButton_yellow.

And one more thing we need to do is to give a name to this layout,

because in this application we want to change the background color of the layout.

So we need a way to refer to it.

So here, let's take the relative layout and

scroll down until you find the property id.

And let's call it layout.

Okay.

Now, I can go to the MainActivity.java file and

start adding some interactivity to our user interface.

So first, let's retrieve a reference to the layout.

RelativeLayout layout.

So that's a relative layout.

And I get a reference by using findViewById method.

R.id.layout.

Then I need a reference to my group of buttons.

So I type RadioGroup

radioGroup_colors.

I use a findViewById.

And I call this radioGroups_colors.

Don't forget to cast that.

Okay, and now that this is done, I can add a listener to this radio group

so that when one item is clicked, I can react to this event.

So it's radioGroup_colors.setOnCheckedChangedListener

Listener.

Let's add a new OnCheckedChangeListener.

Okay, so when one of the item of the radio group is selected,

I'll get the ID of the radio button here.

So now I'll do something different depending on the value of this

integer here.

So if the checked ID is equal to my view named

radioButton_blue, then I will change

the background color of the layout to blue.

So layout.setBackgroundColor.

And let's use a predefined color here, like blue.

Now, if the checkedId is equal to the ID

of the second button, so, it was magenta,

then I will change the layout to magenta.

What?

I forgot the if, else if

layout.setBackgroundColor to Color.MAGENTA.

And last case.

Else, if it's equal to the last button,

named radioButton_yellow, then I change

the layout background color to yellow.

Okay, let's try that first.

I'll run the application on the emulator.

When I click blue, the background turns blue.

If I click magenta, it turns pink.

And if I click yellow, it's turning yellow.

But now if I exit the application, and if I come back to it

after, the application does not remember that the last picked color was yellow.

And the background is back to white.

Now, what we want to do is to remember from one execution to the next

what was the last color picked.

Before we do that, before we add that functionality, I want to show you

something that's quite useful when you are developing with Android.

It's called the ADB, the Android debug bridge.

So, you move to the directory where you've installed the Android SDK,

and there you should find a directory named platform-tools.

So move into that directory.

And there you will find the ADB.

So you can start it using adb, space, shell.

So depending on your operating system, the syntax might look slightly different.

But once you start this command, now, here,

it's like we are on the device, on the emulated device.

So it's only Linux commands that you'll be able to enter here.

So for instance, to list the content of that directory, I type in ls.

And there is one particular directory and subdirectory that we're interested in.

It's data/data.

So let's move into that one.

Change directory, data/data.

And in here I'll find information associated with

all the applications which are installed on my phone.

And you see here, Block05, the one that we are working on.

Let's move into it,

cd fr, okay.

And there, if I list the content of the directory,

for now we only have cache and code_cache elements.

We don't have anything related to preferences.

You'll see that in a while, after we have implemented our new functionality,

it will look different.

We'll come back to these window later on.

For now, let's move back to the code.

Android offers different possibilities for your application to store information.

You can either create a database or create a regular plain text file.

But here we will use preferences.

So preferences are stored as couples of key-value in an XML file.

The object to let you manipulate those preferences is called SharedPreferences.

So, SharedPreference preferences.

I can get one using the getSharedPreferences method.

I need to provide the name of the file.

So if there are no preferences file with this name

existing already, Android will create one when we call the editor.

Otherwise, it will point to the existing file.

And then I need to provide an access mode.

Since I only want my application to be able to access this information,

I'll keep the mode to private.

Then I need to retrieve an editor, let's call it editor, on that file.

I can do that by using the edit method.

Okay.

Now I'll be able to read information from this preferences file and

store information into it.

Okay. First let me change something here.

I would like to replace this series of if-else by a switch statement.

So if you put your cursor here on the if, and

then the little light bulb, you can let Android do that for you.

Replace if with switch.

Okay.

And something else I like to do is,

let's add a variable which will hold the ID of the code for

the color I would like to use for the background.

So let's create a colorCode.

Let's initialize it to zero.

And in here, instead of setting the background directly,

I'll just change that so that colorCode = Color.BLUE.

And same below.

I'll do the same here.

And there.

And I'll set the layout background color only at the end.

setBackgroundColor to our colorCode.

Okay.

Now, what I want to do, also, in addition to set the background color,

is also to remember that color in our preferences file.

So it's time to add something to our preferences file.

With editor.put, it's an integer that we want to put.

And we need to provide a key.

Let's call it colorId.

And then the value.

So in our case, that would be colorCode.

Okay.

The information is not stored on the disk

until you call the commit method on the editor.

So don't forget that.

It's a common mistake to forget this commit statement.

Okay. So now if I run the application again,

Now when I click blue, if I go back to my ADB window and

check the content of that directory again, there is something new.

Notice that there is a shared preference which wasn't here before.

So let's explore it.

So in this directory now, we have a file named COLOR_PREF.xml.

And if I use a cat command, I'm able to see the content of this file.

And you see that I've got one element, one element with the key colorId,

and the value, which is this, it's the code color for blue, okay?

And if I change to magenta and

I repeat the same command here,

you see that the value changed, okay?

But if I exit my application and

if I run it again, the screen is white.

It didn't remember that the last picked color was magenta.

Well, actually, it did remember it, but we haven't used that information.

So we need to add something more to our code.

Here at the beginning, we need to read the preferences file to set

the initial background color for our layout.

So, to read the background color for the layout,

I'll check if the preferences file contains

an element with the key colorId.

colorId.

And if that's the case, then I'll retrieve

this value by using preferences.getInt,

because I remember it's an int I stored,

the int stored with the key colorId.

And then I need to provide a default value.

Let's put 0.

So that's the color code which was saved in our file.

Now let's use that to set the background color of the layout.

layout.setBackgroundColor.

Okay. So now we are reading this information

from the color preferences file, and using it to set the background color.

Let's try the application one more time.

Okay, see, when it started, it read the XML file, found the code for

magenta, and so it turned the background to magenta.

If you want to make sure that's correct, let's click yellow.

And then let's close the application and start it again.

The background is yellow.

In this video,

you've learned how to save information on your phone using preferences.

So preferences is a set of key value that you store in an XML file.

To access this file, you need to create a SharedPreference object

by giving the name of the file and the access mode.

And then to edit it, to store information or

to retrieve information from it, you need an editor.

After that, you can use a putInt, putDouble, putString, or other methods

to store a new set of data in the XML file.

You provide a key and the value.

But the set will be saved on the file

only after you've called the commit method on the editor.

To retrieve an information from the file, you use getInt, getDouble, getString.

And then you retrieve the value by providing its key.

You've also learned how to explore the content of

the file system of your emulator.

For that you can use the ADB shell.

So ADB stands for Android debugging bridge.

And it's located in the platform-tools folder from your Android SDK directory.

Explore our Catalog

Join for free and get personalized recommendations, updates and offers.

Coursera provides universal access to the world’s best education, partnering with top universities and organizations to offer courses online.

© 2018 Coursera Inc. All rights reserved.

Download on the App Store

Get it on Google Play