Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Preview
Start a free Courses trial
to watch this video
Currently, we are only retrieving weather data when the Activity is first created. We can't expect our users to close out the app completely and start it up every time they want to get the latest weather, so let's add a simple refresh button to fetch a new forecast on demand.
This is looking great, and
we have a pretty nice app already.
0:00
However, there's one thing we've
forgotten to take into account.
0:04
Right now we are getting weather data
when the activity is created, or
0:07
when the app starts up.
0:11
That's all find and dandy.
0:12
But we can't really expect our users
to close the app completely, and
0:14
start it up, every time they
want to get the latest weather.
0:18
We can provide a better
user experience than that.
0:21
Let's give them a way
to update the weather.
0:25
If we take another look at our mock-up,
and the resources provided
0:28
by the design team, we see there is
this custom refresh button at the top.
0:31
Let's add this to our
layout in a new image view,
0:36
which we'll design to
allow users to tap on it.
0:39
This way we can make
images a lot like buttons.
0:42
Full grab an ImageView.
0:53
Drag it over here to the top.
0:57
Choose the refresh resource.
1:02
We'll constrain it to the left,
top, and right sides of our layout,
1:07
and the bottom will attach
to the top of our location.
1:11
Let's zoom in a little bit,
make it a little bit easier on ourselves.
1:16
Right?
1:22
Left, top, and
this one will connect to our location.
1:24
For our purposes,
we just need this image clickable.
1:32
And when a user clicks the image, we need
the app to refresh the data and the view.
1:35
Let's turn our image into
a very simple button.
1:40
Now what does our button do?
1:44
It gets a forecast, just like
we're getting already in onCreate.
1:46
Let's do some refactoring of our code,
and use a new method to get a forecast,
1:51
in a couple of different locations.
1:55
We want everything inside onCreate,
1:59
after super.onCreate down to
the end of this if block.
2:01
So here, we can right click.
2:11
Refactor > Extract > Method.
2:15
Let's call it getForecast.
2:22
Nice, it would probably make sense too for
2:26
us to have this new method take
a longitude, and latitude, as parameters.
2:29
Even though we're hard coding that
information into our app right now,
2:34
we might want to extend this
functionality in the future.
2:37
Let's come in here, getForecast,
2:41
double latitude, and double longitude.
2:46
Now we can cut these variables
inside getForecast and
2:54
paste them up here above onCreate.
2:57
Paste them up here.
3:03
And we'll make them final.
3:05
And change our call to get
forecast now to use those.
3:11
Now we need a new method for a button.
3:18
Let's make a new method down
at the end of our file.
3:21
We'll do public void,
call it refresh, OnClick.
3:30
We'll take a view.
3:39
And we'll want to call our getForecast
method with our new default arguments.
3:43
And accept our imports for our view.
3:56
Okay, now where can we use this?
3:59
We're naming this as an OnClick, but
4:02
it doesn't really seem like there's
enough code to do that, right?
4:05
Well, there's a simple way to add
button like functionality to an image,
4:08
such as our refreshImageView.
4:13
If we head into
the activitymain.xml file again,
4:15
go to text, Find our ImageView.
4:21
In this ImageView, we can call
a function when the image is clicked.
4:27
Add the following line after
the last android:layout setting.
4:32
We want android:onClick, and the name and
4:38
the method that we just wrote,
which was refresh on click.
4:41
So what's happening here?
4:47
Well, now when a user clicks our imagine,
the object receives an OnClick event.
4:49
The value for this attribute is the name
of the method that we want to call,
4:55
when the click event is triggered.
4:59
The activity that is responsible for the
associated layout in our main activity in
5:01
this case, then implements the method
that is called from a click event.
5:06
As I mentioned,
5:11
this is a simple way to make images
act like buttons with click events.
5:12
There are some things to
think about with this bill.
5:16
First, the method that is called
in the android onClick method,
5:19
must have the same signature that
we use for refresh on click.
5:23
It must be public, and avoid return type,
and define a view as it's only parameter.
5:27
This method also doesn't
work in all situations.
5:32
For instance, if you need to declare the
click behavior in a fragment subclass, or
5:36
you instantiate the button at run time.
5:41
In those situations, you'll need to define
an onClick listener programatically,
5:44
rather than in an XML layout.
5:49
For our purposes though, this works.
5:52
Let's run this and try it out.
5:55
Well, it seems to be working.
6:08
We're seeing new data show up in the log,
6:10
however, the user won't know unless
something changes with the data.
6:13
When we get data from the network and the
background like this, we usually want to
6:18
display something to the user to
indicate that work is being done.
6:22
There are cases where we don't
want to display anything, but
6:26
in this case,
it's better to add some sort of indicator.
6:29
Let's just add a simple toast message
to our refresh onClick method,
6:33
to let the user know that
data is being refreshed
6:37
Toast.makeText.
6:47
We'll just say refreshing data.
6:53
We'll do it length long.
7:00
And then we'll call show.
7:01
Let's run that again.
7:05
And there's our toast.
7:14
Great, the user will see that
data is being refreshed,
7:16
even if the data doesn't
change on the screen.
7:20
You need to sign up for Treehouse in order to download course files.
Sign up