Getting Started with RecyclerView in Android Lollipop

As an Android developer you’ll no doubt come across situations where you need to display large sets or lists of data without compromising the app’s user experience. To cater to this requirement, the Android OS provides the ListView and ExpandableListView widgets for just this purpose.

Using these widgets however, is not an easy job. To do that, you first have to implement the ViewHolder pattern to minimize the number of findViewById calls. You also need to animate the rows for common operations like Add and Remove, which requires a lot of coding. To address these shortcomings, Google introduced a new UI widget called RecylerView in Android 5.0 (Lollipop).

The RecyclerView widget is basically a more advanced, flexible and more efficient version of ListView. It provides default animations for removing and adding elements so you don’t need to write any code for these activities, and it uses the LayoutManager for positioning items. In this post, I’m going to show you how to use the RecylerView widget to display a list of data. So let’s get to it.

Prerequisites
To conduct this exercise, you should be using the latest version of Android Studio. If you don’t have that installed, you can download it from here.

Usage
Step 1: Adding dependency
The RecyclerView widget is part of the v7 Support Libraries. So to use this widget in your project, you’ll first need to add this Gradle dependency to your app’s module.

Step 2: Declaring in Layout and Configuring in Activity
Next, add the RecyclerView widget to the activity_main.xml file that you can find in the folder titled res/layout. Once you’ve added it to the layout file, you can use it by putting a reference to it in your activity (as depicted below).

Now, add another layout file titled recyclerview_item.xml to the res/layout folder (as shown below). This contains a single TextView which will display a country name and will be used to inflate the row in the adapter.

As you can see from the code snippets above, configuring a RecyclerView widget is slightly different form configuring the ListView widget. Since RecyclerView requires a LayoutManager to manage the position of its items. In most cases you can use the LinearLayoutManager, if you want to position items vertically. You can also provide your own custom LayoutManager by extending the LayoutManager class (as depicted below).

Step 3: Custom adapter with ViewHolder pattern
Next you need to provide an adapter implementation to the RecyclerView widget to enable it to display data, by binding the data to the view, similar to how you would do with the ListView widget.

Since the RecyclerView widget comes with its own unique adapter, you can use a similar approach to the one you use with ListViews. So you basically need to define a custom class that extends the RecyclerView.ViewHolder. This approach minimizes the number of calls that will be made to the costly findViewById method.

Next we need to override two methods so that we can implement our logic, namely onCreateViewHolder  and onBindViewHolder. The onCreateViewHolder method is called whenever a new instance of the ViewHolder class is created, and the onBindViewHolder is called when the data is to be shown in the UI. This method is similar to the getView method of the ListView widget. Our static inner ViewHolder class (declared in the adapter) is responsible for making the findViewById calls (as depicted below).

As you can see in the code snippet below, the getItemCount method returns the String’s (strCountries) size, which is basically the number of rows this adapter needs to display. The onCreateViewHolder method (used below) simply inflates the layout using the LayoutInflater method and returns a CountryViewHolder object with the inflated view passed in its constructor. The onBindViewHolder method on the other hand, handles the binding of the data to the views, which in this case only involves setting the TextView’s text.

Step 4: Compile and Run
Now let’s compile and run the code we wrote above. When you run the SampleRecyclerView on the device/emulator, you will see the following screen. And that’s it!

Wrap-up – RecyclerView

As you can see from this tutorial, the RecyclerView widget is a very useful widget that simplifies the display and handling of large data sets. Since it utilizes Layout Managers for positioning items and has the ability to perform animations for common item operations (like the removal or addition of items), it saves you a lot of time and effort that you can utilize on more important tasks.

Explore our blog

ABOUT FOLIO3

As a leading mobile app development company (iPhone, Android, Windows Phone, HTML5 app development), Folio3 specializes in native app development services and cross platform mobile app development services for the iPhone and iPad. We also offer extensive mobile app testing and QA services. If you have a mobile app idea that you’d like to discuss please or would like to know more about our iPhone app development services, please Contact Us. Learn more about our iPhone, Android and Windows Phone app development services.