Getting Started with Android Development: Android MVVM Architecture

Suyash Matanhelia
Geek’s Nest
Published in
5 min readSep 29, 2021

--

Introduction:

  1. Model-View-View Model:

The MVVM design pattern is similar to the well-known MVC pattern in that the M (Model) and V (View) are relatively the same. The only difference resides between the C (Controller) and the VM (View Model).

· Model — Represents the Data + State + Business logic. It is not tied to the view nor to the controller, which makes it reusable in many contexts.

· View — Binds to observable variables and actions exposed by the View Model. Multiple views can bind to a single View Model.

· View Model — Responsible for wrapping the model and preparing observable data needed by the view. It also provides hooks for the view to pass events to the model. An important thing to keep in mind is that the View Model is not tied to the view.

2) Data-Binding:

Introduced in Google I/O 2015, the Data Binding library helps write declarative layouts and minimize the glue code necessary to bind application logic and layouts.

How is this done concretely? Well, using data binding in a layout requires making changes to the layout file, it will have to start with a layout root tag followed by a data element and a view root element. The data elements describe data that is available for binding.

Binding layout views to Architecture Components

The AndroidX library includes the Architecture Components, which you can use to design robust, testable, and maintainable apps. The Data Binding Library works seamlessly with the Architecture Components to further simplify the development of your UI. The layouts in your app can bind to the data in the Architecture Components, which already help you manage the UI controllers lifecycle and notify about changes in the data.

This page shows how to incorporate the Architecture Components into your app to further enhance the benefits of using the Data Binding Library.

How to use LiveData to notify the User-Interface about data changes:

You can use LiveData objects as the data binding source to automatically notify the UI about changes in the data. For more information about this Architecture Component, see LiveData Overview.

Unlike objects that implement Observable — such as observable fields — LiveData objects know about the lifecycle of the observers subscribed to the data changes. This knowledge enables many benefits, which are explained in the advantages of using LiveData. In Android Studio version 3.1 and higher, you can replace observable fields with LiveData objects in your data binding code.

To use a LiveData object with your binding class, you need to specify a lifecycle owner to define the scope of the LiveData object. The following example specifies the activity as the lifecycle owner after the binding class has been instantiated:

You can use a ViewModel component, as explained in Use ViewModel to manage UI-related data, to bind the data to the layout. In the ViewModel component, you can use the LiveData object to transform the data or merge multiple data sources. The following example shows how to transform the data in the ViewModel:

How to use ViewModel to manage User-Interface-related data:

The Data Binding Library works seamlessly with ViewModel components, which expose the data that the layout observes and reacts to its changes. Using ViewModel components with the Data Binding Library allows you to move UI logic out of the layouts and into the components, which are easier to test. The Data Binding Library ensures that the views are bound and unbound from the data source when needed. Most of the remaining work consists in making sure that you’re exposing the correct data. For more information about this Architecture Component, see ViewModel Overview.

To use the ViewModel component with the Data Binding Library, you must instantiate your component, which inherits from the ViewModel class, obtain an instance of your binding class, and assign your ViewModel component to a property in the binding class. The following example shows how to use the component with the library:

In your layout, assign the properties and methods of your ViewModel component to the corresponding views using binding expressions, as shown in the following example:

How to use an Observable ViewModel for more control over binding adapters:

You can use a ViewModel component that implements the Observable to notify other app components about changes in the data, similar to how you would use a LiveData object.

There are situations where you might prefer to use a ViewModel component that implements the Observable interface over using LiveData objects, even if you lose the lifecycle management capabilities of LiveData. Using a ViewModel component that implements Observable gives you more control over the binding adapters in your app. For example, this pattern gives you more control over the notifications when data changes, it also allows you to specify a custom method to set the value of an attribute in two-way data binding.

To implement an observable ViewModel component, you must create a class that inherits from the ViewModel class and implements the Observable interface. You can provide your custom logic when an observer subscribes or unsubscribes to notifications using the addOnPropertyChangedCallback() and removeOnPropertyChangedCallback() methods. You can also provide custom logic that runs when properties change in the notifyPropertyChanged() method. The following code example shows how to implement an observable ViewModel:

--

--