Android Recyclerview is not new to us but Kotlin programming Language is. In fact, we’ve already discussed in our previous article about RecyclerView and CardView Implementation creating a very interesting project “SongBoard” where we’ve created recyclerview and cardview’s implementation and had seen different implementations for Linear, Grid, Staggered Grid and Horizontal implementations of RecyclerView Android.
In this tutorial of Android RecyclerView using Kotlin, we will be focusing on how to create a RecyclerView and declaring RecyclerAdapter using Kotlin Programming language by creating another special project called “News Board”.
NewsBoard is currently being developed by coderefer using the current popular technologies like Data Binding, Kotlin Programming Language, MVVM design Pattern, ViewModel, etc. The link to that project was given at the bottom of this article.
Android RecyclerView and its WhereAbouts:
Although we have discussed about RecyclerView and its whereabouts in our Previous article, in brief, Recyclerview in Android is the advanced version of Listview to efficiently recycle the views and reuse them.
Lets start implementing RecyclerView in our NewsBoard Project.
Implementation of RecyclerView in our Project:
1. Adding required Dependencies:
Firstly, we need to import RecyclerView in order to use it. Here we will also be importing CardView to effectively show the news articles in NewsBoard. To import RecyclerView and CardView, we need to add the following dependencies:
2. Adding RecyclerView to our Layout file:
Now that we have our required dependencies, we will be adding RecyclerView to our Project by adding the following code to our Layout File in which we would like to add the list of News:
3. Designing List Item to display each news item:
Now that we’ve added the recyclerview to XML file, let us design a layout for news item, which we would be using to populate our RecyclerView.
Here is the xml code for the News item used in NewsBoard App:
If you’ve Noticed, we are using Android Data Binding in the above xml file, whose implementation is explained in our previous article. We’ll only focus on Android Recycler View implementation for this article.
All the icons used above will be available in the project whose link is given at the bottom of this article.
4. Creating a Model:
Next we would be creating a Model class to model each and every news item that we would be displaying in our NewsBoard.
Here is the simplified form of Model class in Kotlin:
We also used a data class in Kotlin. Data classes helps compiler to automatically derive the functions such as toString(), equals(), hashCode() and copy().
You can also see that we haven’t declared getters and setters.
In Kotlin, getters and setters are optional and are auto-generated if you do not declare them in your program.
5. Adding an Adapter:
Next, we will be adding an adapter class. In brief, adapter class acts as a bridge to bind the data to the recyclerview.
In the above code, at line 25, you might have noticed that i’ve used inflate() on ViewGroup. That is an Extension Function written to extend the existing class and to write our own code. Extension Functions are powerful feature in Kotlin. In fact, Google has just announced Android ktx which provides bunch of extensions useful for Android Development as a library. Here is the code from the file where we would be declaring all the required extension functions for our project.
6. Modifying our Activity / Fragment/s code to show RecyclerView:
The last step is to add the following code to your activity / fragment accordingly to show the data in our recyclerview:
If you are using fragment, make sure you’ve added your code in onCreateView() method instead.
If you’ve observed the above code, i am reading the json file from local and parsing it to fill the Android RecyclerView. We’ve discussed on how to read a local file using Kotlin in our previous article.
This completes our tutorial on Android RecyclerView using Kotlin where we’ve used Data binding, Extension Functions and filling recyclerview by parsing the data from local json file.
The link for the complete code is given below: