ViewModel in Android Studio using Kotlin | Android Knowledge

foreign welcome back to my channel in this video we will learn one of the components of mvbm architecture that is view model so first let's understand what is mvvm so in very simple language mbbm architecture gives your project a proper organized structure with the help of its three components first is model then second is View and then third is view model cut it I am not going in detail about View and model because today our focus is only on view model so later in upcoming video I'll cover them but to understand view model we need to know little bit about View and model 2. so let me give you a quick overview about them see in very simple language view handles the user interface basically all the UI components design XML and all and model represents the data it could be local data such as room or sqlite or it could be remote data source such as retrofit API and all cut it and then comes the view model as you already know that view handles UI and model represents data but now the question is how will UI and data will communicate with each other and that's where viewmodel comes into the picture so view model acts as a bridge between View and model it is responsible for preparing and managing between data and UI C model is responsible for only data and view is responsible only for UI but viewmodel is responsible for the communication that takes place between them communication as in actions that needs to be performed like I'll give you an example consider a Notes app where nodes database is sqlite or maybe room database as data that is basically a model and recycler view list view that displays the node as UI that is basically a view and then comes the view model which basically acts as a mediator between them to send and receive request request ends in read the data write the data update the data or delete the data this processing can also be done using live data I'll cover this topic in the next video so stay tuned for that but for now let's understand new model in detail through a sample so open Android Studio choose empty views activity name the project as learn view model let me give you a quick overview what exactly we are going to create so we will be creating a counter app like when the user will click on the button then the account will increment by one it will go like 0 1 2 3 that way I know it's a very simple app but our motto is to understand how can we use view model and other two components as well so let's create it first let's do the prerequisite so go to colors.xml add color as red with xcode as ff3131 and then next go to themes.xml add all the three items color primary color parameter variant and Android status bar color and then go to build.gradle here we will add view binding so write build features then inside it write wavebinding is equal to true and then click on sync now and done now to use wave model we will require viewmodel dependency so let me copy paste it and done then again click on sync now and then you can find the dependency in the description box also let me quickly add background variable just to make the app look more presentable you can skip this step okay close all the tabs now go to activity main.xml here I will create a text view that will display the count and a button that will increment the count simple right so let me quickly create it and done see this is how it looks we have a constraint layout as our parent layout then inside it a text view whose ID is text view counter and then below it there is a button whose ID is button increment and that's it this text View and button are UI components that is basically a view now view is done and then comes the viewmodel we will create a separate class for view model okay so right click on it and create a new kotlin class file I'll write the name as my view model and then now listen to me carefully first we will extend the class as view model then next we will create instruction that needs to be performed on the data but varies data I mean model see as this is a very simple project so there is no such big database like SQL or room database here we have our data as private where counter is equal to zero this counter variable is a data or you can say model got it so we have view as well as model and now it's time to connect both of them via view model class as I previously said that view models send and receive the request such as create read update or delete data so here we will perform two requests first is to read the data and second is to update the data data is in counter value like read counter will fetch the count and display it and update counter will increment the count got it let's implement it first create a function for read so fun get initial counter it will return the initial value of counter that is 0 so as the return value data type is integer so I'll write here as int and then inside it written counter that is 0 itself simple right next as we want to update the count so I'll create an update counter function so I'll write fun get updated counter again it will return an integer so I'll write here as end and then inside it it will return incremented counter now beginners might have confusion with plus plus counter why is it not counter plus plus C if it will be counter plus plus then in that case initial value is 0 and when you click on increment button then the next value is also 0 and then again you click on it the next value will be 1 and so on but if it will be plus plus counter then in that case initial value is 0 and when you click on increment button then next value will be 1 and then again you click on it then next value will be 2 and so on getting my point so encounter plus plus it consider itself first and then increment the next value while in plus plus counter it directly increment the next value got it now we'll model and view model everything is ready let's connect all of them in main activity first let me quickly set a binding [Music] and then next we need to access my viewmodel function so for that we need to call the my view model class so let me quickly declare it and done now I need to initialize my view model so I'll write V model provider C view modern provider is a utility class provided by view model library that helps you to create and retrieve instances of remodel classes for us it's a myvmodel class so first I'll write this as owner this as in main activity itself then using get method I'll retrieve the my view model class then next we need to set initial value on our text view initial value is basically 0 only but if you remember we have created a get initial counter function in my viewmodel class right then my viewmodel DOT get initial counter function dot to string because as you remember function was written integer so to display it on text view we need to convert it to string got it so initial value is set as 0. Now set on click listener on button increment and then inside it on the same text view counter it will display the updated counter value so I'll write my viewmodel DOT get updated counter dot to string and that's it now let's run the app see it's initially 0 now I'll click on increment button and look the count goes like 1 2 3 and so on perfect but if you are new to these topics you will be wondering why there is a need to do all of these things like why can we declare counter 0 here itself and increment it directly why to make such chaos right let me clear your doubt see first thing that view model makes everything structured like model view view model everything is separated and organized if you would have created everything in same activity then that would have been more chaotic right and second the very important reason is that view model can handle system configuration changes very well system configuration as a screen rotations like I'll show you an example this is duplicate counter app project but without using viewmodel everything is in same activity and now see it works exactly same but here comes the twist I'll increment the count and if I rotate the screen then look the account went back to zero again I'll increment it and then rotate the screen see again the count went back to zero it's like every time you rotate your phone the activity will start from the beginning that will be annoying right hence view model is used to overcome this issue this is a counter app project using viewmodel here I'll increment it and then rotate it and see even after the screen rotation the counter value remains as it is now I'll increment it and again I'll rotate it and see again the value is as it is got my point and that's it you can follow us on Instagram or join our telegram for more update Link in the description box so yeah that is it for the video if you are new to this channel then please consider subscribing to my channel and I'll see you in the next video [Music]

Channel: Android Knowledge

Views: 2,109

Keywords: viewmodel, android, androidviewmodel, model, androidstudio, view, livedata, orientation, guide, device, rotation, lifecycle, onsaveinstancestate, architecture, save, room, data, live, change, howto, rotate, kotlin, activity, tutorial, viewmodelprovider, component, components, app, mvvm, counter app, configuration changes, system configuration in android, model view view model., android projects, advanced series, android knowledge, ak, java, android kotlin, screen rotations, coding, android examples, learn android

Id: v32hSKtlH9A

Length: 13min 6sec (786 seconds)

Published: Fri Sep 15 2023