How to use RecyclerView with DataBinding (MVVM)
The Data Binding Library is a support library that allows you to bind UI components in your layouts to data sources in your app using a declarative format rather than programmatically. It provides convenience most of implementation including RecyclerView usage. Today, I will be talk about RecyclerView usage with DataBinding.
First we need to enable DataBinding in our application. Open the app level build.gradle file and add the following lines to the relevant fields:
After enabling Data Binding we ready to go! In this demo we used MVVM architecture and used Hilt dependency injection library for dependency injection process.
Before XML creation we will create base structure for RecyclerView adapter. First we will create ListAdapterItem interface as below:
We will use this interface in our data classes and our base adapter abstract class. Why are we doing this? We want to gather our data classes under a single roof and make use of this interface while creating the base adapter. Thus, we can use base adapter for different data.
After ListAdapterItem, we will create BaseViewHolder class as below:
Then we will create our BaseAdapter class as below:
After BaseAdapter creation we are ready to create our XMLs. First, let’s create our RecyclerView item layout:
We simply create a layout for our Movie data. We need to add <layout> </layout> tags to our XML file to use DataBinding.
Click here to get more detailed information about Data Binding usage.
What are we doing here? We are adding Movie data and Listener to our XML and bind the data to our UI components as above. Data comes directly into our XML from our ViewModels without any processing in our Activity/Fragment.
After RecyclerView item XML creation Let’s create MovieAdapter class.
We implement BaseAdapter class while creating MovieAdapter. We create an interface for click listener events. In bind function, we are setting item and listener for our XML. These movie and listener variables comes from XML file that we created before.
We finished the part that related RecyclerView. Now let’s create MainViewModel.
As you can see above we are using some annotations in our MainViewModel. As I said I used the Hilt dependency injection library. These annoations relate to Hilt.
In MainViewModel class, we implement MovieListener interface because we want to catch click events in our ViewModel.
We used LiveData for our Movie list data. In DataBinding, if we want to update UI elements in declarative way, we can use LiveData variables.
We won’t making call to the real service to obtain movie data. Therefore we need to simultate this process. Other methods is about simulating the service call and retrieving the data.
We created MainViewModel class. Now we are ready to create MainActivity XML file first:
We created main_activity.xml file as above. We are adding our ViewModel class to reach datas which comes from service. Also we are adding our adapter class to our XML file. We will use this variable to set adapter to the RecyclerView. We will use BindingAdapters for this process.
After XML creation Let’s configure MainActivity class:
Annotation is about Hilt.
ActivityMainBinding class is an auto-genarated class. DataBinding library creates this class after we add <layout></layout> tags in our XML files.
After, we are injecting our ViewModel using viewModels<MainViewModel>().
In OnCreate function we are setting our content view. Before setting we are setting viewModel and lifeCycleOwner variables. This viewModel variable in line 12 come from our XML.
On line 17, we are setting RecyclerView adapter. This adapter variable, we added our XML file before.
We will create Binding Adapters for setting up the adapter, sending the list and some other operations.
Don’t forget to add LayoutManager and orientation to RecyclerView. You can use BindingAdapters as above.
Conclusion
In this article we learned how to use RecyclerView using DataBinding. You can add Base configuration and Binding Adapters to your project and easily use RecyclerView with DataBinding.
You can access the project from the link below:
Thank you.
