Every developer wants to create a clean architecture of project and also achieves this on the first release of the application. But for big projects, if you want to fix any bug, you have to put lot of consideration into the structure of the application code becomes of the complexity of code. The solution of this problem is Android MVVM architecture.
MVVM also called Model-View-ViewModel is project architecture which is currently in fashion. The reason behind its popularity is its clear architecture.
MVVM – Clean Architecture
Android MVVM architecture is used to separate our view (i.e. Activity and Fragments) from your business logic. When we use MVC & MVP architecture, it is very hard to manage the code.
Model-View-ViewModel with Clean Architecture is pretty good in such cases. It goes one step further in separating the responsibilities of your code base. It is used to abstract the logic of the actions that can be performed in your app.
Model
The model is used to represent the actual data and/or information with which we are dealing.
Example -> Model might be user login data (Email, Password)
View
View is the presentation of the data.
Example -> xml and activity files in our Android project.
Model-View-ViewModel
It acts as the link/connection between the Model and View and makes stuff look pretty.
Lets take an example ->
User login-in through MVVM architecture ->
Firstly create a model class which represents our data.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
class LoginData : BaseObservable() { var email : String = "" @Bindable get() {return field} set(value) { field = value notifyPropertyChanged(BR.email) } var password : String = "" @Bindable get() {return field} set(value) { field = value notifyPropertyChanged(BR.password) } } |
Here, we are binding email & password variable with our xml through “@Bindable” & “BR.email & BR.password”. Now, when user enter email & password, it will automatically saved in Model class variables.
There are one edit text for email, one edit text for password and a submit button.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 |
<layout> <data> <variable name="data" type="com.firebaseinappmsg.myapplication.MainViewModel"/> </data> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <EditText android:layout_width="match_parent" android:layout_height="wrap_content" android:hint="Enter Email" android:text="@={data.loginData.email}"/> <EditText android:layout_width="match_parent" android:layout_height="wrap_content" android:hint="Enter Password" android:text="@={data.loginData.password}"/> <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:onClick="@{() -> data.callApiMethod()}" android:text="Submit"/> </LinearLayout> </layout> |
Now, we are going to create our ViewModel class.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
class MainViewModel : ViewModel() { var responseCode = MutableLiveData<Int>() var loginData : LoginData init { loginData = LoginData() } fun callApiMethod() { /*call api and update mutableLiveData*/ } } |
Create a viewModel class which works as connection between our view & model class. Here, we create our Model class object in his “init” method and a method callApiMethod() which will be called when we click on “Submit” button.
Now, we are going to create Activity and connect our view & viewModel in it.
|
1 2 3 4 5 6 7 8 9 |
override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) mainViewModel = ViewModelProviders.of(this).get(MainViewModel::class.java) binding = DataBindingUtil.setContentView(this, R.layout.layout_login) binding.data = mainViewModel mainViewModel.responseCode.observe(this, Observer { /*do something*/ }) } |
Here, we observer our mutableLiveData. When we update responseCode value, it will be observed in our activity.
For more information, you can check this link -> MVVM
Be the first to comment.