How To Use RecyclerView

RecyclerView is an enhanced version of the ListView. ListView restricts you to using a linear list only. The core idea behind both of them is the same, if you are displaying a large list, you do not need to have everything loaded up in your memory. For example, if you’re building a chat app and you need to display your contacts, you do not need to have all of the constants loaded at the same time, and if your list contains profile images than your phone can run out of memory really quick. That’s why the Android team developed the ListView and the RecyclerView. As I said, RecyclerView gives you a little bit more flexibility and brings some new UI elements such as CardView, StaggeredGridLayoutManager etc.

Create a template

This might seem familiar if you’ve ever messed around with the ListView. Both RecyclerView and the ListView require a template that your app is going to inflate for every item in your list. This is just a regular XML resource file. It can be anything you like. For this example, we’re going to be building an app that displays a list of the best graphic cards in 2017. If your app is going to be displaying a simple linear list like this, than you’re better of using ListView as it is simpler to write, but this is a simple example designed to show you the basics of RecyclerView.

My template is going to be this:

This template shows three TextView. One for the name of the graphics card, one for the manufacturer and one for the price.

Writing the data class

I prefer to do use Kotlin when writing anything that contains a data class, but for this example I wrote the class in Java. It’s a simple data class with the usual getters and since I’m not going to be dynamically changing any of the data, I set all of the data in the constructor.

Writing the adapter

The adapter connects the RecyclerView to the XML template and sets all of the fields accordingly. The RecyclerView adapter is a little bit different than the ListView adapter. Let’s first see how it’s supposed to work than we’ll go over all of the parts in detail.

The thing that stands out the most is the ViewHolder inner class. This doesn’t have to be an inner class, I just put it there because of convenience. A ViewHolder is basicly a class that holds all of the elements that our XML template has. It holds all of the views in a specific position in our list. We need to override three methods in order for this to be able to run.

onCreateViewHolder basicly just inflates our XML template, creates an instance of the ViewHolder class and returns it.

onBindViewHolder method is used after the XML layout is inflated. Inside this method, we put all of the needed pieces of data in views in our XML template.

getItemCount just return a number of views that we’re going to inflate. The best way to do this, if you’re using some sort of list, is just to call the size() method.

MainActivity

The XML layout of the activity should look something like this:

You should know that if you’re gonna be using the RecyclerView you’re going to need to add this to your dependencies in build.gradle:

And for the MainActivity.java file, it’s as simple as this:

I think that this part is pretty straightforward. And for the list of graphics cards I wrote a static this method that you can use for this test case:

//Note: The price value for some of the cards is in euros and for others is in dollars.