Android MVVM LiveData Data Binding With Examples

We’ve already implemented MVVM using Data Binding and covered LiveData and Data Binding in separate tutorials. Today, we’ll use LiveData with Data Binding in our MVVM Android Application. We’ll see how LiveData makes it easy to update the UI from the ViewModel.

MVVM LiveData Data Binding

Up until now, we’ve used Data Binding to update the View from the ViewModel. LiveData is a handy data holder that acts as a container over the data to be passed. The best thing about LiveData is that it is lifecycle aware. So if you are in the background, the UI won’t try to update.

This saves us from a lot of crashes at runtime.

We’ll use the MutableLiveData class since it provides public methods setValue() and getValue().

Let’s create a simple Login Application using the above concepts. We will first use LiveData as well as Two-way Data Binding and then refactor the Data Binding Observables to LiveData completely.

Getting Started

Add the following dependency in your app’s build.gradle:

Project Structure

android-mvvm-livedata-databinding-project (1)

The LoginViewModelOld file would contain the old code and LoginViewModel file would contain the refactored code.

Model

We’ve defined our Model in the User.java class:

Layout

The code for the activity_main.xml is given below:

The ProgressBar would be displayed to simulate the login feature.

ViewModel

The code for the LoginViewModel.java is given below:

An ObservableField is an object wrapper to make it observable.
In the above code, we’ve encapsulated User inside a LiveData. Every time the user object is changed it will be observed in the MainActivity and the appropriate action would be taken.

When the button is clicked, we set the ProgressBar to Visible. View.VISIBLE = 0.
View.GONE == 8

After a delay of 5 seconds, the email and password are validated and the TextInputLayout bindables are updated.

ObservableField isn’t lifecycle aware.

The MainActivity.java class is given below:

In the above code, the observe method looks for changes in the User object that was contained in the MutableLiveData. It displays a toast with the username and password.

Now, let’s replace the ObservableField with LiveData completely.

Refactoring ObservableField to LiveData

The code for the new LoginViewModel.java class is given below:

The above class now extends ViewModel since we no longer need BaseObservable.

Now, we’ve changed the ObservableFields to MutableLiveData. Changes in the MutableLiveData would be automatically updated in the layout thanks to Data Binding.

Our MainActivity.java class is now updated to:

ViewModelProviders.of can be used to create ViewModel instance too as done above.
This method instantiates the ViewModel only once. Every subsequent call would reuse the instance.

The LifecycleOwner is an interface that our Activity can bind to.

The output of the above application in action is given below:

android mvvm live data data binding demo

As you can see, the Toast message isn’t shown when the user leaves the application. Since the LiveData is lifecycle aware. When you open the application again, the toast would be displayed.

This brings an end to this tutorial. You can download the project from the link below:

By admin

Leave a Reply

%d bloggers like this: