Kotlin Project - Android Functional Todo Application - Part 1

Key Takeaways

hi guys welcome to an Android Kotlin tutorial my name is tensor today we're going to be building out a to-do application with Android I know a bunch of you guys just rolled your eyes because we're building yet another to-do application on this channel however before you decide to exit this video let me just mention that we will be implementing this application in a fully functional and reactive way without the use of the reactive X libraries also to do applications are good examples to cover because they force the user to implement a crud style of architecture for the data in the application this tutorial will be split into two parts because I do not want to overload you guys with a bunch of different ideas so keep that in mind as we go ahead we will be making use of two of the Android lifecycle component libraries namely the live data library and the view model library live data is an observable data holder class basically live data follows what's called the observer pattern this is a pattern where when an object is updated the rest that depend on that object are also updated in essence objects watch each other's state through subscription and then change accordingly the view model library is a class that manages the data that is viewed by the activity basically it allows us to communicate with the data where and it calls the business logic of our application based on the life cycle of the application it also maintains the data and keeps it alive as long as it's needed we also make use of the antico Commons library this is basically just a utility library that was created by JetBrains to add a bunch of helper functions into android for the Kotlin programming language alright so to create our application we want to give our application a name and then we want to check the box that says include Kotlin support then I'm going to select API 22 you can select whatever you want and we want an empty activity inside of this and we're just going to leave all this as it is once your application has finished building you will see obviously the main activity open up as well as the main activity res open up we just want to close these real quick because we want to make changes to our build Gradle files so you'll notice that you have you build Gradle files inside of your application one is for the top level of the application and that's this one and then the other one is for the actual module of the application inside of our top level Gradle build file we are going to add two lines of code so just extension variables one will be called arch version and this will be the version number for our lifecycle component libraries and then the other one will be called echo version and this will be for the angka library then we want to go into our build Gradle file here with all of our dependencies and stuff and we want to add our dependencies first we want to add comm dot Android dot support and design and the version number of this will correspond with the comm dot Android dot support app compat library that already is inside of your application so mine for instance is 26 1 0 this 26 is the SDK version so if you're on like version 27 our version 28 this will say 28 dot 1 0 and so on and so forth and also just a real quick very useful way of figuring out the latest version if you input the incorrect version and you just hover over it you'll see here that it will say that there's a newer version of this library and it will give you the version number and you can use this feature to your advantage to find out the version numbers for the libraries that you want to import next we want to bring in our view model in live data dependencies so these are Android arched lifecycle extensions and then we add our arch version and then we want the compiler which is Android arch lifecycle compiler and for the compiler we're going to use this annotation processor rather than this implementation function and we're simply doing that because the compiler is a different type of library than the lifecycle extensions library next we want to bring in Uncle so this is just for JetBrains Danka Danka Commons and then we put in the onco version variable that we made the other file and these are all the libraries that we're going to need for this project so now we want to click this sync Now button and this will get all the dependencies and check to see if the version numbers are proper and all that stuff you can see that we failed to resolve our Co Commons 9.3 and this is because the latest version is actually 10.4 are not 9.3 so if we put in that version number here take it out and then put it into our extension variable then we can re put in our uncle version and we can try resyncing this and our grade oil has built properly so we know that everything is working as it should we want to create a package called model and this will be the package that will have all of our various data files and classes and stuff inside of it well start with a file called to do and this will just be a data class and we just want to shape this piece of data so that it will be the backbone for how our two dudes should look hard to do will have a value of text which will be a string and then we'll have an ID which will be a long and we'll have the status which will be a boolean and we'll set that to false by default so we want the user to be able to put in the to do body in a text box and then we'll generate an ID for each to do and then the status will be whether or not that to do has been completed and then we can use that to remove the to do's as well we want to create another file called to do model and this will have the actual model or our application so we'll have a value called - duze which will be a list of our to do type this will have all of the - duze inside of it and then we'll have a value called visibility which will have our visibility type inside of it now of course this will throw an error because we haven't created the visibility so now we want to create a file called visibility Katy inside of this we're going to have to Co classes one of them will be called action and the other one will be called visibility action will have nothing inside of it but our visibility class will have three different classes inside of it so with our visibility Co of class we want to have a class called all a class called active in a class called completed and will have all these extend our visibility class and we're going to be using these so that we can filter through our to do so if we have a bunch of to do's that are completed and we just want to see those completed to dues we'll be able to select the completed visibility type and then this will allow us to see those two do's now I know some of you may be asking why do we not use an enum for this and that's because we're going to be using a very reactive functional way of building this application now we want to extend our actions yield class with a bunch of different actions that we can take so we'll create a counter here this will be the counter that will increment our IDs for our to do so as we add into dues they'll start at 0 and they'll go up data class add to do we'll have a text and ID and the ID will be by default our counter incremented and then we'll extend action with this we want to add a few more actions and you got to keep in mind that these will be the actions that the user will be able to take inside of our application these are can add it to do the user can toggle it to do and to toggle it to do all we need access to is just the ID we can set the visibility of it to do and this will only need to augment the visibility variable and then we can remove it to do and all we need for this is the idea as well now we want to create what's called our store layer and our store layer is basically the layer between the actual activity and the data first file for this package that we want to create is going to be called store which will be an interface the first method that we want to give to this interface will be our dispatch method this is a method that will allow us to apply our actions so this is a method that will allow us to apply the actions that we created to our data store in a purely functional manner so when we dispatch we're going to say ok dispatch to this action and then do this you want to create another function inside of our interface called subscribe and this will allow our activities to subscribe to our live data and it will also allow us to transform our live data in various different manners we're passing in what's called a renderer and this of course is something that we haven't created yet and our renderer has a generic type inside of it of T then we have a function that we're passing through and this is the function that we want to edit our data with for instance if we want to just get the completed to Do's then we can filter our data using a map function or using a filter function so that we only get specific to dues that are based on the visibility now let's build out the renderer this will be another interface inside of our store package and again we want to give this a generic type of T so that we can apply it to any of the types inside of our data and our render function will just pass in the model which will come from our live data and then we'll pass in the generic type so this is the only function that we need to implement and this allows us to render a UI that we need for our model all right so now let's implement basically the largest part of our application and that's the to do store this will be a class inside of the store package and we'll have this extend our store with to do model being passed into it as well as the view model which comes from the Android lifecycle library and you'll see immediately that our class gets an error and we can alt enter on the class and we can click implement these members and it'll say that we want to implement this dispatch and subscribe' function so we select both of them and then we hit OK and it will then create two overrides for us before we get to implementing these functions there we want to add a few properties to this class the two properties that we want to create are our state and then our initial state our state is a mutable rive data of to do model and we want to set this equal to mutable live data and then we want to initialize our state by calling to do model and we're going to pass in a list of so just an empty list and then we'll set our visibility by default to you visibility all ours dispatch function will just assign to state value reduce which is a function that will create here with the state value inside of it and then the action that we want to actually implement on our state so this will allow us to basically change our state based on the action that we want to take for instance if we want to add a to-do then we just pass in the action of add to do and then we pass in the to do that we add and this allows us to modify the state this way we'll create our reduce function this will just be a private function it will take in the state which will be a to do model that is potentially nullable it'll take in the action which will of course be an action type and then we'll output our to do model first we'll set up our new state so this is going to be the state that we're going to be passing back so we're going to use the Elvis operator assign it to either state and if state is null then assign it to initial state we're going to return a one block and this one block will allow us to go through each one of our actions and do something based on that action one of the nice features of Android studio is that we can click all to enter on our one block like this and then we can click Add remaining branches and this will automatically add all of the branches that assigned to this one block for our add to do action we call on new state and then we want to copy specifically the - duze field from our new state so we call new state - duze and we set that equal to - duze and then we convert it into a mutable list and then we're going to use this apply function to allow us to apply our action to our me to list basically we're just going to call this add function and then we're going to create a new to-do by inputting the action dot text and then our action ID so for instance when we add it to do we're going to call the action add to do and then the action add to do has inside of it the to do itself which has a to do dot text and to do dot ID so we can just take that out of our action and then put it into our new mutable list and then send that back as our - duze alright so now let's implement our toggle - duze action and for this we we need access to our to-do list so we call new state - duze and this time we're going to call the map function on our list of data we'll have an if check this will allow us to check to see if the ID of the action that's being passed into here is equal to one of our elements so basically we're iterating through our list of elements and we're iterating through each of the IDs and then we just want to invert the to do that we've selected data's so if the status is true then was converted to false and vice-versa so we just say it dot copy and then we look for the status and we set it equal to the negation of its status if we don't find an action that gives us back the ID that we're looking for then we just want to pass back it and what we can do is we can cast this entire return output as a mutable list of to do for our set visibility branch or we're going to do is call new State copy and then we're going to change the visibility to action that visibility then for the remove to do branch we're just going to call the filter function on our list of two do's and then we're going to basically check each of our items and make sure that the ID of the item that we're removing is not equal to that item that way it just basically removes the item of the ID that we want to remove and it keeps the rest of them we iterate through our entire list we find the ID that we wanted to eat we throw it out and then we keep the rest of them and then we need to cast this back as a mutable list of to do now let's implement our SUBSCRIBE function so we just called renderer which is the renderer of to do model that we're passing into here and we call the render function that we created and we're just passing in the transformations map so we're basically passing back the state and we're mapping our function that we're passing into this onto the state so we just take the list of data that we have and then we apply a function to it and then we return that data and we keep doing that over and over and over again as our application runs all right guys so this is a good place to stop for this part of the tutorial if you liked this tutorial feel free to subscribe and like if you have any questions or comments feel free to comment in the comment box below and if you just liked this tutorial then by all means download it as much as you like have a good day