This course will be retired on July 14, 2025.
Heads up! To view this whole video, sign in with your Courses account or enroll in your free 7-day trial. Sign In Enroll
Well done!
You have completed Google Play Services!
You have completed Google Play Services!
Preview
Continue to build your UI Code using RecyclerView
Treehouse Course on Android Lists and Adapters
Related Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign upRelated Discussions
Have questions about this video? Start a discussion with the community and Treehouse staff.
Sign up
We're gonna be creating our adapter.
0:00
It's gonna bind our data to a view.
0:03
So let's go ahead and
create a new adapter.
0:06
I'm gonna call mine listing adapter.
0:08
And it's going to extend
the RecyclerView.Adapter class.
0:11
The RecyclerView.Adapter
class takes in a type and
0:18
the type has to extend the holder class
that also comes with recycler view.
0:22
So we need to go out and
create a class called listing holder and
0:27
we can just put that right
inside our listing adaptor.
0:32
And it needs to extend view holder.
0:42
It's telling us using the red lines that
we need to implement some methods and
0:44
we have some code we need to write here,
so lets go ahead and
0:50
ask it what we need to do.
0:54
You can use Alt return to do this,
we need to make a new constructor and
0:56
we need to implement a few methods here.
1:00
OnCreateViewHolder, onBindViewHolder and
getItemCount.
1:03
Okay.
These are all the default methods and
1:07
we need to start filling
these out one by one.
1:09
OnCreateViewHolder, it's going to
create a new instance of view holder.
1:12
OnBindViewHolder, it's going to
bind our data from the listing
1:16
into the views themselves.
1:20
And getItemCount is just gonna return back
the number of items we're displaying in
1:22
this list.
1:26
Okay.
Let's write a constructor for
1:27
our listing adapter class.
1:29
Constructor's public, ListingAdapter and
we need to make sure we pass in a context.
1:30
Context is required,
because we need layout inflater object.
1:37
Our inflater object is going to inflate
our XML that we just created and
1:41
create the views for us.
1:47
So our inflater, we can use inflater dot,
1:49
Layout_Inflater.from context and
pass in the context.
1:52
And now, we have an inflater object.
1:56
In onCreateViewHolder, all we need to
do is create a new view holder and
1:58
it takes in the item view, which is
the layout that we need to inflate.
2:04
So we'll call it inflater.inflate.
2:10
We're gonna pass in our layout.
2:13
Our layout is in RES and you can see
up here, it's called layout_listing.
2:15
Let me pass in a viewGroup and
false, since the recycler
2:22
view is going to do the actual
adding of the view to the parent.
2:27
Now, in the listing holder,
we need to put in references for
2:34
the ImageView and the different
text views that we had as well.
2:38
So we had a TitleView, a TextView for
2:42
shopNameView and
another final one for the price.
2:47
Let's make sure we import all of these and
2:55
we're just gonna get references to them
by looking them up within our itemViews.
2:58
So, imageView is going to
be itemView.findViewById.
3:03
The IDs we set were starting with listing.
3:09
So we've got image here.
3:12
And it's gonna tell us we need to make
sure we cast it to the right type,
3:14
which we'll go ahead and do.
3:18
I'm just gonna do that for
every single one of these.
3:20
Now you might be using
something like Butter Knife or
3:31
another library that makes this easier for
you.
3:33
That's okay too.
3:37
I'm just doing this by hand.
3:38
Since my project is fairly self-contained
and small, it's not a big deal.
3:40
If your project is larger and has more and
more classes, you probably want to go
3:44
with a library like Butter Knife
to make this a little easier.
3:47
Great.
3:54
Now we need to add in somewhere to
actually store the listings in here, so
3:55
that we can return
the number in getItemCount.
3:59
So let's go ahead and
scroll up to the top of the class and,
4:02
and add our listings in here.
4:08
The object is active listings and we can
just call it something like listings or
4:11
activeListings.
4:15
I'm gonna call mine, activeListings
just to describe the exact object there.
4:16
And we need to be sure that we
check that this is not null
4:20
when we return the item count.
4:24
So, if it is null, just return_0,
cuz we don't have anything.
4:27
We also need to check,
even if we have the activeListings object,
4:35
we need to check that the actual listings
array is not null within it as well.
4:38
So.
4:43
That's called results.
4:47
So, if that is null,
also need to return_zero.
4:48
Finally, if there is something there we
can just return the length of that and
4:53
that's how many listings we have.
4:58
Now, an onBindViewHolder,
this is where we're gonna actually,
5:00
get a listing, get the data from it and
bind it to our views that we've inflated.
5:04
So to start, let's get a listing object.
5:09
Make sure we import the listing class.
5:20
And now for the holder, the holder
is our listing holder object and
5:23
it has the different
views that we sat on it.
5:27
So let's do the simple one, titleView.
5:30
Let's go ahead and setText and
5:34
that's gonna be listing.title.
5:38
Set the price and a shop name.
5:42
Now the shop name is
stored in the shop object,
5:53
which we can do .Shop and
then in here, shop_name.
5:57
The final part of this is
to display the image and
6:00
we can use Picasso that we added earlier
in our build.gradle file to do this.
6:04
To do that, let's go ahead and
go to next line and we're just gonna say,
6:11
Picasso.with and we just need our context,
so every view has a context.
6:17
So we'll get our imageView and
say, getContext and
6:23
we wanna go ahead and load and
where are we gonna get this?
6:27
Well, we're gonna get it from our listing.
6:33
And in our listing, we have the images and
6:35
we're just gonna get the first
one available to us.
6:38
It's an array of images it returns back,
we're just gonna get that very first one
6:41
and get a URL for an image to load and
there's several to choose from.
6:45
Let's go ahead and just load this very
large one and we want to load it into our
6:50
folder imageView.
6:56
Since our adapter is what cares about
the dataset, we're gonna make the adapter
7:02
be the callback when we access
the API using Retrofit.
7:07
When successful, we can replace
the current dataset with the new data and
7:11
then call notify dataset change
to ensure the list gets redrawn.
7:15
Let's go ahead and do that now.
7:18
In our adapter class,
let's scroll all the way up to the top and
7:20
after the extends clause, we're just gonna
add on a new line, an implements clause.
7:24
And we just need to implement
the callback from Retrofit and
7:29
the callback is typed
to ActiveListings and
7:34
it's gonna ask us what kind of
callback we're talking about.
7:37
And the callback is the Retrofit one and
it's imported here.
7:42
And it's gonna say that we need
to implement a few methods and
7:48
we're gonna go ahead and do that.
7:50
There's two methods, success and failure.
7:52
So, on success, we're going to replace our
activeListings with the activeListings and
7:55
we need to add this.activeListings
to differentiate between
8:01
our classes variable and the one
being passed into the success method.
8:06
And the we simply call
notify dataset changed here.
8:11
In the failure state, we're gonna need
to handle this at some point later on.
8:14
But for now,
we're just gonna leave it blank.
8:19
Let's take a break and when we return,
we're gonna setup our activity to make
8:21
an API call and actually display a list
of listings from Etsy on the screen.
8:25
You need to sign up for Treehouse in order to download course files.
Sign upYou need to sign up for Treehouse in order to set up Workspace
Sign up