Bummer! This is just a preview. You need to be signed in with a Basic account to view the entire video.
Writing Your Adapter Class8:31 with Jamie Huson
Continue to build your UI Code using RecyclerView
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 up