image
Create Post Data Model
Start course
Difficulty
Intermediate
Duration
3h 12m
Students
20
Ratings
5/5
Description

The course covers Recycler Views, which is one of the most important features of Android app development. They allow us to work with lists or grids of data with a ton of built-in optimizations. We'll then put your knowledge into practice by building an app to display a list of posts that we can scroll through, edit them, delete them, etc.

We'll also explore object-oriented programming with Kotlin, focusing on how to build objects, work with inheritance concepts and interfaces, and other highly advanced features. You'll also learn about classes and objects and how to work with them with the Kotlin programming language.

Intended Audience

This course is intended for beginners to Android app development or anyone who wants to master coding in Kotlin.

Prerequisites

Since this is a beginner level course, there are no requirements, but any previous experience with coding would be beneficial.

Transcript

Hello and welcome back. So, we're making some good progress here with our recyclerview and got a generic view item to display 30 times based on how we set it up in the adapter, but that's not very useful yet because we would want each item that's displayed here to be a unique blog post with title, body, and eventually different images. So, what we're going to do is create some dummy data so we can fill in these posts with that data, and usually in situations like this you would have a data source of some kind where you're getting the data to fill in the blog posts with like a database, with tables where you can pull that data from. It could be in your phone's local storage, which we'll learn how to do later on using a SQLight database. 

It could also be a database in the cloud somewhere like Amazon Web Services or Google's Firebase, and we will explore how to use Firebase to set up our data on the cloud later on as well. But for now, we'll create a sample list of blog posts because the focus right now is to learn how recyclerview works and how to get this set up going from a basic implementation perspective. We can deal with the data source later on. So, let's get started. If you look at each of these items we can call them a post. Each one being a post and each post contains a title, a body, and an image and of course there is the edit and delete actions, but ignore those for now because we're going to have images for them later on. But basically, we have an image. We have a title and a body. So, if you are thinking about how to set up an object like this, you could think of a class and we can call it post with properties or attributes of image, title, and body. 

And whenever you have a situation where you're trying to set up objects and you want to communicate with the database or a data source to work with, let's say retrieve our update data in it, you would call the type of that object or the class a model. So, here we'll be working with a post model which will be our blueprint for each one of these blog post items. So, let's go ahead and create our blueprint or our post model. So, I'll go to projects and right here you can create a new package here for models but I'll keep it simple and simply create a new class file. So, right click new Kotlin File class  and I'll call it Post with a capital P since I wanted to be a class. Remember, upper camel case, and class, hit 'Enter', and there is my post class and this class will be a blueprint for each post object that we create all we're doing is modelling how to store the data of title, body, and image. 

So, when you have a class like this where you don't intend to implement any other methods or functionality and all you're specifying is how to hold the data, Kotlin specifies to call it a data class. So, I'm going to call this post a data class. All right and then the properties will be image, title, and body. So, I'll open and close parentheses, and I'll call the image icon Image. It will be of type int  and you may be wondering, why am I calling it an int? It's because we don't actually store the image itself. What we do is store a reference to where the image is and that is an int. For example, we're going to be storing images in our res/drawable folder right here. We'll have a few other images and the reference to that from here is going to be an integer and you will see that in action soon. 

So, I can't image int then we'll have title, so title. This will be of type string, and then we'll have body, this will be of type string as well. And we can get rid of the curly braces over here because we don't need anything else in the body of our class, that's it. That's our data class for post. So, let's move on to how we would build multiple post object. So, I'll create a fun main over here to test this out. Open and close curly brace. So, let's say val my post equals post. Post object and then open and close curly brace. Now, here would have to provide the image, title, and body for each post. So, for the image I can refer to my drawable folders R.drawable. and let's select an image, I'll select my baseline account vector asset and again you can create a couple of new ones here. If you remember we did this earlier, you can go to your drawable folder, right click new vector asset and create one. 

Select an icon that you'd like to use. I'll just use the one that I have for now and then we'll have a title, I'll say, "My first post title", and then the body, I will say, "Body of first post". So, now that I have a post object I can do println(myPost) and I'll make some more room here for now. All right, now you may be thinking okay I'm simply running printline on my post, and if you remember in the past, when you try to print out an object like this, it just gives the object reference some arbitrary data. It doesn't give anything useful. But here, since we named it a data class, the two string which actually is what makes the object viewable in the way that we want, converts it to a string basically for data class, the two string is a bit different and it gives a nice formatted look in the output. So, if I go ahead and run this, you'll see that, run this. There you go. You see it gives a nice formatted output. I have my image reference. 

You see that's what I was referring to as the integer. This refers to the clip art that I have in my drawable folder, the title My First Post title right there and body of first post, great. So, we have successfully been able to use this post model or post class to create a post object. So, now that we know how to create one, the next step would be to create dummy data. So, let's say we wanted 30 of these then you could think about just going on creating a list and just adding post objects like this manually, which you can possibly conceive for 30, but what if you wanted to make Dummy Data for 500 Post Objects? How would you do that? So, instead of doing this manually and creating multiple posts, we're going to write a for loop and do this algorithmically. So, let's create a list first. I will say val list equals, it will be an array list and open close curly brace and I have to specify the type. 

So, it's going to be an array list, including objects of type post which we just created. All right. So, now that we have our list, we want to basically go through and fill in this list with objects like this, but with slightly different titled and body. So, let's run a for loop. I'll run a for loop for i in, let's say zero, until, let's go to 30, open curly brace, and then after this, after this code right here, I will close curly brace. All right. So, since my list is right there, what I want to do is add objects like this in my list. So, what I'll do here is say list.add() and then take the closing curly brace and put it right after we've created our post and here within each I don't have to create a val. All I really need to do is create a post object on the fly and add it to my list. So, right here I'll keep the image, I will format this a little better and move the closing parentheses over there. So, for each of the post objects, for now the image will be the same. That's fine. 

The title, let's customize this a little bit, instead of my first post title, I'll say title of post and then I'll put in a $i. So, this i right here. So, it'll start at zero and keep going and then over here body of post also $i. All right. So, you can see how my list is going to be filled with these post objects. So, let's go ahead and print this out after my for loop is done. So, right here I'll say print a line and then list and run it. All right, so there you go. I have my list starting here. And as I scroll past, you can see all of these different posts that were created. The reference to the image is the same because we're using the same image for each of the posts, but you see we have title of post 1, body of post 1, title of post 2, body of post 2. All of them are different and they go all the way up to title of post29, body of post 29. And you may be thinking, well we went till 30 why is it 29? It's because the index starts at zero and goes to 29, does not actually include 30. 

All right, it goes all the way up to 29. So, we got 30 post objects. So we know how to now create a list of dummy data. Let's add one optimization to this. We only have one image that we're using for all of our posts. So, let's make it a little better and try to include 3 or 4 of these images. And, as you already know to create a new Vector Asset, we can go to drawable, right click, New and Vector Asset. Right here, Clip Art, we can choose a different Icon. So, we have like 4, 5 different icons, I can select this one, then 'baseline_ ac unit', next, that's good so now I have two. So, what I'm going to do is pause this video and create three more and I would recommend you do the same. And, we're going to use this to update the image associated with each of our posts. So, I'm going to go ahead, pause this video to take care of that, I suggest you do the same, all right. Welcome back. So, I've gone ahead and added a few more of these Vector Assets. 

So, now I can use multiple images. These are the five that I have that I'm going to use. So, let's go ahead and add the functionality to have these different references. So, what we're trying to do is for each of these items, we're trying to update this to be one of the five in order. So, as  I moves along, it selects different ones. So, let's go ahead and implement that real quick. I'll do it over here and we can do this with a check for I at every step. So, if I is zero, then select one, I is one, select two, but it'll go all the way to 30. What we can do since I have five images, I can use the model operator, so, let's see how to do that. Val, I'll say "imageToSelect equals", how do you split up 30 numbers into five? 

So, blocks of five, you can do it this way  I % 5. That'll give you a nice even split since you're trying to split 30 into five separate blocks. So, you can go something like if this is equal to zero then something else If it's one then something else If three all the way up to five, you can go that way or you can use a when operator. We haven't seen this before, so you do the same thing here like this when this value and then open and close curly brace, you have to specify what it is. So, if it's zero then it expects me to return something. So, when this value is zero, I'm going to have it return this first one. ic_baseline_ac_unit' . So, I'll specify that 'R.drawable.ic_baseline_ac_unit', right there. Okay, when it's one then I'll specify a different one. So, 'R.drawable.' let's go with the account when it's two, 'R.drawable.' let's go with 'add_photo' three, 'R.drawable.circler' and then for this to work correctly, you need to have an 'else' over here. So, I'll say 'else' for the last case. So see here, 1,2,3,4, the fifth case, since we're splitting in groups of five 'else' will say drawable, it is not drawable, 'R.drawable.homescreen'. Okay? This way at every step, I'll have image to select as one of these five based on what the value of I is. And since I'll have that and I will try to create my post object right below it right here. Instead of having this code 'R.drawable' hard coding the baseline_account image over here, I'll simply have image to select. All right, so let me close this now if I run this then I expect all these reference numbers for the images to be different. So, let's go ahead and do that. We minimize this, let's run it. All right, check it out. My first reference is 93 right here. Second one is four, third one, let me scroll, keep scrolling, you see it's five, then six, then seven. Then it should repeat, so you have three again, then four, then five, and six right there, then seven. So it's going to keep repeating. All right?

So blocks of five So, now I'm gonna have basically 1,2,3,4,5 images, all of these are going to be different, and then the next five are going to be different, and it's going to keep going until it gets all the way to 30. Great, all right, so I'm going to minimize this. So, now I have a working way of how to create a list of dummy data with different images and different titles and bodies. But I'm not going to leave this code here in a main this was done just to build it up from scratch. I could create a function here and have it return this list and then use that when I need to create dummy data. But think of it from a database perspective, usually you wouldn't get this from a data model right here. You'd get it from a separate source like a database. So, what I'll do is try to simulate that so under project for my 'alphablog', I'm going to create a new class and I'll call it 'MockDatabase'. 

So, right click, "New", 'KotlinFile/class'. I'll call it 'MockDatabase' and it'll be a class and I'll add all the functionality in here and I'll take the code from here. All this command X. I don't need the print line, I'm going to be returning it and I'll paste it in a function over here. I'll call it 'fun createMockData'. This will return an 'ArrayList' of type post and then open close curly brace, then paste in the code over here. And you see I still have a red over here for this closing curly brace. That's because it expects a return value, It expects this list that I've created to be returned or something else to be returned. So, whoever calls this, 'createMockData' function will get that list. So, what I'll do is I will simply return this list. 

Once I do that you see the error goes away, but notice something here, I've created a class for 'MockDatabase' since I'm trying to simulate that this data is coming from a database and I've created a function here which is a member function or a method associated with an object of this class. But the thing is, I don't want this method to be associated with any object of my MockDatabase. I simply want this to be available for me so I can simply call on this function to get a list of 30 post objects. So, in a situation like this where you have a function that operates independent from objects of your class. So, you don't need to initiate any objects of your class, you can specify this as a companion object. 

Okay, so that's Kotlin way of doing this, she would simply say companion object, open close curly brace. I'll take this closing curly brace and I'll put it below this. There we go, that takes care of the indentation for us so again, this is Kotlin's way of saying that this whatever I have in here is not related to any objects that I create of MockDatabase. So, I don't have to say some valve database equals a database object and all that to use this, I can simply use this directly. And if you're coming from a python background, think of this as static method in a class and I'll go back here and get rid of this main because I don't need it. 

All right, okay, so now we have a way of generating our dummy data and we're going to leave it at that for this video. In the next video, we'll modify our adapter and specify which piece of data from our post object belong in which field of our post view. Right now, our adapter isn't doing any of that, and our view is simply this over here, we have to actually specify that the title, grab the title that we get from our list for one object and then associated body and image and so one for all of our post objects. So we'll be letting recycler review know how to lay out and present our blog posts on the screen. Okay, So I hope you're excited and I'll see you in the next video.

 

About the Author

Mashrur is a full-time programming instructor specializing in programming fundamentals, web application development, machine learning and cyber security. He has been a technology professional for over a decade and has degrees in Computer Science and Economics. His niche is building comprehensive career focused technology courses for students entering new, complex, and challenging fields in today's technology space.

Covered Topics