Create Android app with MVVM pattern simply using Android Architecture Component
🧐 What is MVVM?
First, let’s talk about what the MVVM pattern is. The MVVM pattern is a pattern derived from the MVP pattern defined by Martin Fowler in the 1990s. The MVVM (Model-View-ViewModel) pattern helps to completely separate the business and presentation logic from the UI, and the business logic and UI can be clearly separated for easier testing and easier maintenance. Let’s take a look at View, ViewModel and Model
View
View is responsible for the layout structure displayed on the screen. You can also execute UI logic.
ViewModel
The ViewModel implements the data and commands connected to the View to notify the View of state changes via change notification events. Then, the View that receives the state change notification determines whether to apply the change. The ViewModel here is different from the ViewModel of AAC (Android Architecture Component). The ViewModel in AAC is a class that knows the Lifecycle to hold the data used by the View in changes like screen rotation. If you want to use the MVVM pattern while developing Android, you can implement it without using AAC ViewModel.
Model
Model is a non-visual class that has the data to use. Examples include DTO (Data Transfer Objects), POJO (Plain Old Java Objects) and entity objects. It is commonly used service or repository that need to access or cache data.
As you can see from the figure above, ViewModel knows Model but does not know View and View can know ViewModel but does not know Model. Now let’s use AAC JetPack to apply the MVVM pattern to your project more easily.
⛰ Architecture
In this example, it is implemented based on MVVM pattern and repository pattern and Local DataSource is not used.
- AAC Components (LiveData, Lifecycle, ViewModel)
- DataBinding
- Koin (dependency injection)
- Coroutines
1. Connecting View and ViewModel
DetailActivity
has the object that binds the layout file using the binding
method of BaseActivity
. Lines 16–20 connect lifecycleOwner
and ViewModel
and Data
, and observe the characterList
of DetailViewModel
.
DetailViewModel
has data of characterList
and loading
status. characterList
receives data from the network via the repository
asynchronously in the liveData block. Before receiving the data of characterList
on the network, activate loading
status and observe this in DetailActivity
, and will update loading
status after receiving data.
I used DataBinding to configure the background color and loading screen of RecyclerView
. and I implemented a loading using LottieAnimationView
.
2. Pass RecyclerView logic to BindingAdapter
Now you can use the BindingAdapter to connect the adapter to the RecyclerView and implement the itemDecoration.
And simply use it.
3. Configure Repository
Repository is one of the design patterns where Eric Evens is define. When the ViewModel requests the data that will be used for the View, the Repository will provide you this by choosing the appropriate data locally or on the network. At this point, the ViewModel doesn’t care if the requested data was retrieved locally or from the network. You can make it independent of a particular implementation by using Repository as an interface and creating an implementation.
The method called getCharacters
is defined in the Repository
interface
and this is implement in the RepositoryImpl
class. I implemented Remote DataSource in the same way.
Then I used koin
to create a single bean object of type Repository
.
That’s all!
Using Harry Potter API and Jetpack, I made an example of applying MVVM pattern easily. Thank you for reading🙌 If this posting was helped, please give a star at GitHub.
The all code can be found here.