In the very last chapter (Adapter + ViewHolder) we have created the adapter, which handels the items of the list. We have created the view holder as well. The view holder’s task is to set the itemss’ values and to handle the click listeneres.
We are going to add the action for the Send button. This will call a method inside of the viewmodel, which will update the list and the RecyclerView, that a new item had been inserted.
So let’s start coding. 😎
If you haven’t done the previous chapters, then from GitHub you can download the starter project for this chapter.
Step 1 – Add new to ToDo to the list
As we have talked about earlier, we have created already a ViewModel, where we store the list of the RecyclerView. We are going to have there all of the operations on the RecyclerView either.
First, we are going to add to the ToDoViewModel::class the addToDo() method. So, open the ViewModel, and paste the below code there.
First in this method, we gonna add the new item to the list. Then, we gonna add the whole list to the MutableLiveData, whose value is returned by the listOfToDosLiveData LiveData.
That’s all about the ToDoViewModel::class.
Step 2 – Set the observer
From now on, we can observe everywhere in our app the changes. We gonna have only one observer, which will be in the RecyclerFragment::class.
So open the class. There, we will create the observer inside of the onCreateView() method.
Copy and paste the below code into the onCreateView() method. Be careful to paste it before the line of return.
Briefly, this method will be called, when the value of the MutableLiveData had been changed. When this happens, then the observer will notify the RecyclerView about the changes. The result is, that the new item will be added at the end of the list.
Step 4 – Create variables
We are going to handle the action of the create new item inside of the AddToDoDialog::class. For this, we will need some variables, and changes.
First of all, we have to create 2 new member variables inside of the class. So open the AddToDoDialog::class, and paste there the next 2 variables.
The rootView variable will hold the layout of the dialog. The toDoViewModel can be familiar for you, because this will hold an instance of the ToDoViewModel::class from the Navigation Component.
The rootView is still not initialized. Because we have to use the views from the layout in other methods as well, we have to have this as a member variable and we will initialize it inside of the onCreateView() method. Here, we have to change the return and first save the View into this variable.
So, refactor the code like this:
From now on, we can use rootView in the method of the createToDo().
Step 5 – The createToDo() method.
Because we have to return a ToDo object and add to the list of the RecyclerView, we have to create an instance regarding the information from the filled dialog.
This method will get back a ToDo object directly. So, copy and paste the below code into the AddToDoDialog::class.
Note some things in this method. First, how we create the due date, then how we get the selected item from the Spinner.
Step 6 – Handle the actions
The last step of this chapter is to add actions to the Close and Send buttons inside of the dialog. The click listeners will be located in the onViewCreated() method.
The Close button
We can close the dialog, if we tap somewhere outside of the dialog, but to have a better user experince, we gonna implement a Close button also. Inside of the click listener of this button, we will call the dismiss() method.
Copy and paste the below code snippet into the onViewCreated() method, after the initSpinner().
The Send button
The click listener of the Send button won’t be difficult neither, because it will call the addToDo() method from the ToDoViewModel, then we will close also the dialog.
Paste the below code after the click listener of the Close button.
Run the app
Finally run the app. After a successful build, when you create a new ToDo item, then it will be inserted to the RecyclerView.
The source code is available on GitHub
I hope the description was understandable and clear. But if you have still questions, then leave me comments below! 😉
Have a nice a day! 🙂