Android RecyclerView — Decoded

If you have been developing android apps, you might have come across RecyclerView, and if you have tried implementing it, you’ll know how big a pain in the neck it can be. To dumb this down, here is a medium article for you to get some insights on what recycler view is and how it can be used.

RecyclerView is a flexible view for providing a limited window into a large data set. It is used when we have data collections whose elements change at runtime based on user action or network events.

To implement a RecyclerView, we need to work with:
1. Adapter— It handles the data collection and binds it to the view
2. ViewHolder— It describes an item view and metadata about its place within the RecyclerView.
3. LayoutManager — It is used to specify how the items will appear in the RecyclerView.

RecyclerView.Adapter

An Adapter is used to connect our data to the RecyclerView and determine the ViewHolder that will be used to display that data. It converts an object into an individual list item View to be listed and displayed to the user.

Choosing which adapter to use is crucial to accomplish your tasks.
1. RecyclerView.Adapter — Base Adapter that enables you to display a layout with elements for small data collections

2. ListAdapter — It is built on top of RecyclerView.Adapter. It is used when the data changes frequently including computing diffs between Lists on a background thread.

3. PagingDataAdapter — It is also built on top of RecyclerView.Adapter and is used with Paging Library. It is used when you have large data collections and loading the entire collection together requires a lot of resources even though only a small part is visible at a time. We can use PagingDataAdapter to load a small part of that collection at a time and can fetch more data based on our requirements.

RecyclerView.ViewHolder

As the name signifies, a ViewHolder is used to hold an item view of the recycler view. To implement Separation of Concerns, we create a separate file for the ViewHolder and keep the Adapter as simple as possible. So if we have any UI changes, we don’t have to modify the adapter file.

RecyclerView.LayoutManager

A LayoutManager is responsible for measuring and positioning item views within a RecyclerView as well as determining the policy for when to recycle item views that are no longer visible to the user.
You can either specify the LayoutManager from XML

app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager"

or from Kotlin code.

recyclerView.layoutManager = LinearLayoutManager(context)

There are three default layout managers available to us:

Layout Managers for RecyclerView

1. LinearLayoutManager — It is the most commonly used layout manager. It is used to display data linearly in a list vertically or horizontally.

recyclerView.layoutManager = LinearLayoutManager(context)

2. GridLayoutManager — Used to display data in a grid. It requires an additional parameter — spanCount which specifies the number of columns the grid should have.

recyclerView.layoutManager = GridLayoutManager(context, 2)

To specify the grid layout manager from XML code, you need to add spanCount as well

<androidx.recyclerview.widget.RecyclerView
    xmlns:app="http://schemas.android.com/apk/res-auto"
    ...
    app:layoutManager="androidx.recyclerview.widget.GridLayoutManager"
    app:spanCount="2"/>

3. StaggeredGridLayoutManager — Used to display data in a masonry layout. It also requires the number of columns and the orientation of the grid.

recyclerView.layoutManager = StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.VERTICAL)

Let us start by making a small contacts app that lets you store the contact details of your friends.

For now, we will be hardcoding the contact details directly in kotlin as it is a recycler view tutorial but in the next articles, we will be storing these details in the room database.

To do that, we first create a Contact model to store all the details

Then, we create an adapter ContactRecyclerAdapter with the contact list as a parameter that extendsRecyclerView.Adapter.

As you can see in the above code, we set ContactViewHolder as the view holder for the recyclerView. Therefore, we have

We also have to make the layout file that we are inflating in the ViewHolder.

Now that we have our adapter ready, it’s time to attach it to our recycler view.

And the layout file for the fragment will be…

Handling Click Events

One problem that most people face while using recycler views is handling clicks from the fragment. Since recycler view does not provide us with a function to handle click events, we have to make our own click listener. We do so by using an interface.

We have a function onClick that takes the view, position, and an object of the item which was clicked and we pass it from the fragment to the view holder through the adapter. We can implement our interface in our fragment and handle the click events from the view holder.

So, if we want to navigate to the view details page by clicking on a contact, we can do so by creating a new interface.

We add an object of our interface as a parameter in our adapter and send the same to the view holder.

In the view holder, we specify the view to which we want to attach the clickListener. Here, we do not have a specific view to handle clicks so we directly add the click listener to the root.

Handling the click from the fragment:

Conclusion

In this article, we learned the different types of adapters and layouts that can be used with RecyclerView and how we can easily handle click events on items in the recycler view.

An awesome way to apply the knowledge gained from this article would be to create a custom file template that does all the above procedures in a seamless manner!

Do stay tuned to our medium page for further inquisitive Android Dev Articles!