RecyclerView in Android: Tutorial

What is RecyclerView?

RecyclerView is an advanced version of ListView with improved performance and customizability. It was included in API level 22 (Lollipop) in the support-v7 library. RecyclerView is used in most of the apps. It can be used when we want to display a list of items through which the user can scroll. Each item in the list rendered by a layout file.

In this tutorial, we will learn how to:

  • create a RecyclerView with a custom adapter.
  • add a divider using ItemDecoration.
  • add touch events like onClickItem and onLongPress.

Creating Project and Adding Dependencies

1. Create a new Project in Android Studio with the name “Recycler View Demo” and package name com.androiddeft.recyclerviewdemo.

2. Now open build.gradle file and add RecyclerView dependency as shown below:

3. Open activity_main.xml and add RecyclerView widget

Creating the Custom Adapter

In this tutorial, we will be listing Top 10 Hollywood movies along with their genre, year of release and rating.

1. First of all, let’s create a new package named beans (com.androiddeft.recyclerviewdemo.beans) inside the main package.

2. Now create a new POJO named Movie inside the beans package with the following code. This class will help in holding the movie details:

3. Create a new layout filed named movie_list.xml. This will represent an individual item. This layout has TextViews to display movie name, genre, year of release and rating. It also has an ImageView to display the star.

The android:clickable and android:background attributes help in creating the ripple effect whenever an item is clicked.

4. Now create a class named MoviesAdapter.java. This class will act as an adapter for the RecyclerView. It has a simple class named CustomViewHolder, which extends the ViewHolder class of RecyclerView and defines the initializes the views. MoviesAdapter class overrides the onCreateViewHolder method, which inflates movie_list layout. It also overrides onBindViewHolder, which helps in setting movie attributes to the view.

5. Now open MainActivity.java and add a method named populateMovieDetails, which populates the Movie Details. Define the RecyclerView and set the instance of MoviesAdapter as the adapter. Also, set the LayoutManager and ItemAnimator.

Now run the application and you will see list of Top 10 Hollywood Movies as shown below:

RecyclerView

Adding Divider or Separator

In order to add a divider,

1. Define the separator in the drawable folder named item_seperator.xml

2. Now create a class named DividerItemDecoration, which extends the RecyclerView.ItemDecoration class. We override the onDrawOver class in order to draw the separator.

3. In the MainActivity class, add the Item Decoration to the RecyclerView.

 

When you run the application now you should see separators added as shown below:

RecyclerView with Divider
RecyclerView with Divider

Adding Touch Events

To add the Touch events, you need to implement the RecyclerView.OnItemTouchListener interface. Create a class named RecyclerItemListener and add an interface named RecyclerTouchListener with 2 method signatures for onClick and onLongClick.

In MainActivity, add OnItemTouchListener for the RecyclerView, which takes the instance of RecyclerItemListener as the parameter. RecyclerItemListener instance defines onClickItem and onLongClickItem. We have added Toast messages to display which item has been clicked.

The Complete MainActivity class

Here goes the complete MainActivity which has RecyclerView with adapter, divider and touch events.

You can see in the following animation the ripple effect, toast messages when clicked and long pressed. If you face any error while coding or following this tutorial, do post them in the comments section. Happy coding!

Download Source CodeDownload APK

RecyclerView Demo Animation

Stay Connected

No spam guarantee.

Abhishek

Abhishek

Abhishek loves coding. His favorite is Android Development. Apart from coding he loves traveling and reading.
Abhishek

Leave a Reply

Your email address will not be published. Required fields are marked *