6th Aug 2021

Advanced DataBinding in Custom Views

Mobile App

Written By, Bhushan Maniyar

Overview

Hello folks, Greetings of the day.

Have you ever thought about creating a custom view and binding data with a custom view? If not, you are at the right place. Here I am going to discuss how we can create a custom view and after that, we will look at how we can bind data with our own custom view.

What is data binding in android?

Basic knowledge of data-binding:
The data is provided by a ViewModel, MVVM is a design pattern that works very well with Data Binding.
data-binding
The Data Binding Library is an Android Jetpack library that allows you to bind UI components in your XML layouts to data sources in your app using a declarative format rather than programmatically, reducing boilerplate code.
Types of data binding

  • One Way
  • Two Way

One Way data-binding: One-way-data-binding means data flows in only one direction like updating UI from the data source.

Two Way data-binding: Two–way-data-binding means data flow in both direction like
Updating data source from UI and getting updated from a data source.

Creating our own Custom View

When you need to create some custom and reuse the views when it is not provided by the Android Ecosystem. Custom Views can be used as widgets like TextView, EditText, etc.

First of all, we need to create an xml file that represents the layout of our custom view.

And after that, we need to create our logic for our custom view

OutPut:
data-binding-output

Data binding with our custom view

Enable Data Binding in your Project:
data-binding-custom-view
So, let’s start with the binding process in custom view:

In order to bind data with the custom view, we need to create our own binding adapters which listen to the update of data
Data binding works with LiveData, Observable Fields and now it also supports Stateflow. In the latest release of Android Studio Arctic Fox 2020.3.1 (4.3), they had given the support of binding data with Stateflow. In order to bind data with Stateflow we need Gradle Plugin version 7.0.0-alpha04 or higher…so make sure to follow these configurations so you don’t get errors at runtime 😉

So, as we know how we can bind data with our views so this is similar to a custom view in addition we just need to create our own binding adapter and we are good to go…
Let’s start with creating a Binding Adapter with our Custom View

There are two Binding Adapters

  • @BindingAdapter(“editTextValue”)
  • @InverseBindingAdapter(attribute = “editTextValue”)

@BindingAdapter(“editTextValue”):

This adapter works very well when we only want to set data from the model to view and this is only responsible for setting data value to a view. If we want to update from view state to a model we need @InverseBindingAdapter

@InverseBindingAdapter(attribute = “editTextValue”):

This adapter is responsible for updating the model from the view state like when we have a checkbox we get an update about if the checkbox is checked or not. In this blog, this adapter is responsible for updating the EditText text value to our variable in ViewModel

And the other hand we have setListener() function which takes two parameters
1.CustmView
2.InverseBindingListener.
which is responsible for updating the value in real-time which is a kind of observer for the data bound to the XML.
ViewModel:

MainActivity:

Layout File

Output:
data-binding-custom-view-output

Benefits of Custom VIew and Databinding

  • When we have one view more than 2-3 times and have the same usage we can create a custom view that reduces boilerplate codes and we can wrap the same logic for view in just one file instead of writing in all files in which we are including that view.
  • As we know data binding is part of MVVM (Model – View – ViewModel) it reduces boilerplate code faster development time, faster execution, and more readable and maintainable codebase.. 🙂

Conclusion

As we have seen, data binding and custom views are very interesting and powerful features for development. For more in-depth knowledge check out Android Developer documentation for data-binding.

Thanks for reading. To help others please click ❤ to recommend this article if you found it helpful. Happy Coding.

Written By,

Android Developer at Yudiz Solutions Pvt. Ltd