Creating a ToDoList Android Application with Android Architecture C...

Repository

https://github.com/googlesamples/android-architecture-components/

What Will I Learn?

How to Implement ViewModel of the Android Architecture Component
How to create a ToDo Listing Application .

Requirements

IDE for developing android applications(Android Studio or IntelliJ)
An Android Emulator or device for testing
Java Programming knowledge
Must have read the Part 1 , 2 & 3 of this series

Other Resource Materials

Difficulty

Intermediate

Tutorial Duration 20- 25 Minutes

TUTORIAL CONTENT

In this Tutorial, we are going to continue learning the Android Architecture Components, specifically the ViewModel component. But before we proceed to today's tutorial, below is a brief highlight of the former parts of this tutorial series.

PART 1 : In the part one of this tutorial series, we implemented the Room Database component of the Android Architecture Components in creating a simple todo application. Here we carried the following operations: Insert new Task Entry and load all task from data base.

PART 2 : In the second part of this series, we learned the Singleton Pattern and implemented it with the Executor. The Executor here, enabled us to make database queries on a separate thread other than the Main Thread.

PART 3 : In the third part of this tutorial series, we learn about the LiveData of the android architecture components and how to implement it in our to-do list application. The LiveData as we saw from our last tutorial notifies our UI of data change on the database. With this , we do not have to re query our database every time a change is made to the Database.

For this PART 4 of the series, we will learn about ViewModel and how to implement it in our to-do list application. OK lets get started!!!

STEP 1 : Update Gradle Files

You have to add the component libraries to your gradle files. Add the following code to your build.gradle (Module: app) file, below the dependencies block.

implementation "android.arch.lifecycle:extensions:1.1.0"
annotationProcessor "android.arch.lifecycle:compiler:1.1.0"

STEP 2 : Create a ViewModel Class MainScreenViewModel that Extends AndroidViewModel

What is a ViewModel?

According to the android architecture component documentation, the ViewModel class is designed to store and manage UI-related data in a lifecycle conscious way. The ViewModel class allows data to survive configuration changes such as screen rotations.

Lifecycle of a ViewModel

Image Source

The figure above shows the lifecycle of the ViewModel. Basically the ViewModel object is created when the activity is first created. The viewModel created persist even when activity is rotated and its onCreate method called, The ViewModel calls its onCleared method when the activity is destroyed, to release memory resources.

Why ViewModel?

In our to-do list application, when we rotate the android device, there is a configuration change (Screen orientation change). our activity is destroyed and recreated thus querying our Database every time this change occurs . Without the ViewModel, our application keeps querying the database for data every time onCreate on the main activity is called. The image below shows our application rotated several times without the ViewModel. The log message says reading from Database every time. This is not efficient at all.

Also Caching large data (our list of task) is made easy with ViewModel.

code block for class MainScreenViewModel

public class MainScreenViewModel extends AndroidViewModel {
    private LiveData<List<Task>> taskList;

    public MainScreenViewModel(@NonNull Application application) {
        super(application);
        AppDataBase appDataBase = AppDataBase.getsInstance(this.getApplication());
        Log.i("View Model"," Retrieving data from database");
        taskList =  appDataBase.taskDao().loadAllTask();

    }
    public LiveData<List<Task>> getTaskList() {
        return taskList;
    }
}

Code Explanation

Basically we created a class MainScreenViewModel that extends AndroidViewModel.
AndroidViewModel is a ViewModel that accepts an Application parameter in its constructor
Were created our livedata object taskList to store the list of tasks retrieved from the database
The database object is declared and initialized in the constructor .
The taskList variable is initialized in the constructor by calling the loadAllTask method in taskDoa on the database object.
we create a getter method getTaskList that returns a list of tasks wrapped in a liveData object

STEP 3 : Update Code in getTasks Method

Current Code in getTask method of MainActivity

private void getTasks() {

   final LiveData<List<Task>> tasks = appDataBase.taskDao().loadAllTask();

       tasks.getTaskList().observe(MainActivity.this, new Observer<List<Task>>() {
            @Override
            public void onChanged(@Nullable List<Task> tasks) {
                toDoListAdapter.setTasks(tasks);
            }
        });
}

Code Explanation

in this block of code , we retrieve our list of task from the database and then observe it for any change in the database. This is made possible by the Livedata
This method is called every time our activity is rotated so our database is queried again.

New Code in getTask method of MainActivity

private void getTasks() {

     MainScreenViewModel viewModel = ViewModelProviders.of(this).get(MainScreenViewModel.class);

        viewModel.getTaskList().observe(MainActivity.this, new Observer<List<Task>>() {
            @Override
            public void onChanged(@Nullable List<Task> tasks) {
                toDoListAdapter.setTasks(tasks);
            }
        });
}

Code Explanation

Here we get our ViewModel by calling the providers class of this activity, and pass the view model class as a parameter.
Now, we retrieve our live data object using the getTasklist method from the ViewModel.
Now if we rotate our device, there are no new calls to the database as our live data is cached in the ViewModel.

STEP 4 : Test the App

After refactoring our codes to implement ViewModel, we can now proceed to test the app. Below is the app demo.

The image below shows messages from the logcat . The query to our database is done just once even after multiple rotation

Curriculum

Proof of Work Done

The complete source code can be found on github

https://github.com/enyason/TodoApp_Android_Architecture_Components

Creating a ToDoList Android Application with Android Architecture Components - PART 4