Android MVVM in a simple way

Two years ago during Google IO 2017, Google introduced MVVM (Model View View Model) Architecture for android app development.

Now why this was done is because -Adding everything in a Single Activity or Fragment would lead to problems in testing and refactoring the code. Hence, the use of separation of code and clean architecture is recommended.

There different Architecture to do so like MVP ,MVC,MVVM,etc

But here we are gonna discuss MVVM

MVVM stands for Model, View, ViewModel.

• Model: This holds the data of the application. It cannot directly talk to the View. Generally, it’s recommended to expose the data to the ViewModel through Observables.
• View: It represents the UI of the application devoid of any Application Logic. It observes the ViewModel.
• ViewModel: It acts as a link between the Model and the View. It’s responsible for transforming the data from the Model. It provides data streams to the View. It also uses hooks or callbacks to update the View. It’ll ask for the data from the Model.

Now let’s try to understand it more easily with an example

The 4 steps of MVVM

1. Create Model (aka POJO)
2. Create Repository (fetch data from API or DB)
3. Create ViewModel (extend ViewModel, get liveData from Repository)
4. Create Activity (observe ViewModel & display data)

Step1: Create Model (aka POJO)

Let’s create a Pojo class to store the value of each holiday

public class HolidayModel {

    private String date;
    private String name;

    public String getDate() {
        return date;
    }

    public void setDate(String date) {
        this.date = date;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

}

Step 2: Create Repository

A repository is a class where we fetch data from API or DB.

In the repository getter method create a variable with MutableLiveData

final MutableLiveData<List<HolidayModel>> mutableLiveData = new MutableLiveData<>();

Fetch data from API and set the data into this variable.

mutableLiveData.setValue(response.body());

Refer to the example below.

public class HolidayRepo {

    private final String TAG = getClass().getSimpleName();

    public MutableLiveData<List<HolidayModel>> requestHolidays() {
        final MutableLiveData<List<HolidayModel>> mutableLiveData = new MutableLiveData<>();

        ApiInterface apiService =
                MyApplication.getRetrofitClient().create(ApiInterface.class);

        apiService.getHolidays().enqueue(new Callback<List<HolidayModel>>() {
            @Override
            public void onResponse(Call<List<HolidayModel>> call, Response<List<HolidayModel>> response) {
                Log.e(TAG, "getCurrencyList response="+response );

                if (response.isSuccessful() && response.body()!=null ) {
                    Log.e(TAG, "requestHolidays response.size="+response.body().size() );
                    mutableLiveData.setValue(response.body());
                }
            }

            @Override
            public void onFailure(Call<List<HolidayModel>> call, Throwable t) {
                Log.e(TAG, "getProdList onFailure" + call.toString());
            }
        });

        return mutableLiveData;
    }

}

In the example, I’m using Retrofit to fetch a public holiday list

Step 3: Create ViewModel

ViewModel is just a class created by extending ViewModel to hold data, the official definition is

The ViewModel class is designed to hold and manage UI-related data in a life-cycle conscious way. This allows data to survive configuration changes such as screen rotations.

To create a ViewModel, extend a class with ViewModel, initialize the repository object in constructor, create LiveData variable, create a getter method to get value from the repository and set into LiveData.

public class HolidayViewModel extends ViewModel {

    private HolidayRepo holidayRepo;
    private MutableLiveData<List<HolidayModel>> mutableLiveData;

    public HolidayViewModel(){
        holidayRepo = new HolidayRepo();
    }

    public LiveData<List<HolidayModel>> getHolidays() {
        if(mutableLiveData==null){
            mutableLiveData = holidayRepo.requestHolidays();
        }
        return mutableLiveData;
    }

}

ViewModel Example.

Now that we have created Model, Repository, and ViewModel. let’s go to the final step.

Step 4: Create Activity

In Activity create an object of ViewModel, call the getter method and observe the data using LiveData as shown below.

HolidayViewModel holidayViewModel = new HolidayViewModel();
holidayViewModel.getHolidays().observe(this, new Observer<List<HolidayModel>>() {
    @Override
    public void onChanged(List<HolidayModel> currencyPojos) {
        adapter.addHolidayList(currencyPojos);
        adapter.notifyDataSetChanged();
    }
});

Whenever data is changed you’ll get a callback in the onChanged method. Inside the onChanged method I’m setting the ArrayList to my adapter.

The above part completes are all parts of MVVM.Hope that helped you.

Keep Coding!!