Hello and welcome back. In this video we'll add our actions associated with each of our posts which are edit and delete. So, first we're going to add the edit and delete images over here, little icons that can be clicked and we'll add them to our view which is the post.xml file. First, let's go ahead and create a couple of vector assets for the images. So, right here, I'm going to go to res drawable,  right click, New, Vector Asset and I want to get the edit image. So, from clip art, If I look for edit, you see the edit pops up, I'll use this. Feel free to use whatever you want and I will change the name to a baseline_edit. Similarly, right click, new for the delete. I look for delete. There we go, select that. Delete, next, finish. 

So, I have my edit and delete images right here and I'm going to add them to my post view. So, I'll make some room and since I want them right next to each other over here, towards the right of my view, I'll use a linear layout to manage it within my constraint layout, I'm going to say linear layout  and I want the width to be match_parent and then heights to be wrap_content. I'll leave that for now and within here, I'm going to add my two image views. So, I'll say image view. There we go, layout_width. I'll choose 50dp. Feel free to modify this as you like. And then height, 50 dp. The source I'm going to select my edit right there. Then, I'll close my tag for the image view. I'll also give it an ID. So ID, 

I'll call this edit_post_image and then I will copy this image, command C. And then paste one right below it command V. And this one will be delete_post_image. So, I'll change the ID to delete_post_image width and height are okay and the source, this is going to be baseline_delete. Yep, that's the image. So, you see the images are showing up but it's all over the place. So, let's add some constraints to my linear layout. First, I will infer constraints so, I'll click on this infer constraints. Layout_width is zero but, it's constrained. End_toEndOf="parent" that's good. Start_toStartOf="parent" that's good. And Top_toTopOf="parent". It added some margins. 

So, marginTop, marginEnd, that's fine as well. I'm going to add constraint to the bottom. So, I'll say Bottom_toBottomOf="parent" as well and to move the contents of this linear layout, so the two image views. I want to move them to the end, to do that I'll use gravity="end". Now, you see my two images are to the right of my view, great. Now, that I have my images and position correctly. Let's build the functionality and if you look at the post adapter that we have here, I have my PostViewHolder and this is the view holder for each row or post object that I have, which we already know. So, each one of these, this is the holder that's responsible for all its content. 

So, this is where I'll capture the reference to the edit and delete post, but we're going to get started with delete first. So, in this video we'll implement delete. So, what I want to do is hold a reference to this delete_post_image, this element. So, let's see how to do that similar to how we did it for the other ones, we'll say val_deleteImage, I'll give it a name and this is of type ImageView. And just like we did for the other ones postView.findViewByID. Then R.id, there is my delete_post_image. And now that I have my reference, what I want to do is set an onClickListener for it. So, basically on this delete image, I want an onClickListener. So, I'm able to click or tap on it and we want this to happen when my PostViewHolder object is getting created. So, it gets the same recycling optimizations as my other properties that I have already like the image title and body. 

So, let's set it up using the init block which we learnt about in our object oriented programming videos. So, I'll say init and within here we'll set the onClickListener. So, I'll grab my deleteimage.setOnClickListener. And I'll use this second one for now. I'm going to switch it to the first one. Let's see how the second one works that has the curly braces, so just a block and some code within it. So, open curly brace and close curly brace. And all I'll do for now is when the button is tapped, print something to the console. So, I'll say print line Delete post image clicked for position-- and I want to specify what position I have this in and how do you get the position from my view holder objects? How do you get the positions for that? Well, our adapter provides this for us in the form of adapter position. It's a property of our recycler view adapter. So, I can refer to this by saying adapter and you see adapter position pops up. 

So, I will select that. So, let's run this and see if it works. All right, welcome back. I had a bit of a disruption there  because my logs were not opening up or connecting to the device. So, I basically restarted android studio and it should be working now. So, I'm going to pull up my logs actually. So, right here. So, where we left off, was that if I tap on or click on any of these posts on the trash image or the delete image, then I should get some output here telling me which one was tapped. So, let's go ahead and do it. There you go. Delete post image clicked for position 15. So, let's go and tap on this one. Let's see, let's scroll down. There you go. Delete post image clicked for position 7. 

Now, let's go to the bottom. Let's do this one right here. There you go. Delete post image clicked for position 29. So, we are registering the click. Now, the next step is to remove the post at that position. So, I'm going to go back right here and I'm going to get rid off this block, and remember we had two options for setOnClickListener. So, I'm going to take this one, the one on top here. And this requires the interface of View.OnClickListener to be extended or implemented. So, for my PostViewHolder over here, I'm going to need to implement this view.OnClickListener over here if I want to use this functionality, which I will and this requires a parameter to be passed in  to the constructor and that is which object you want to initialize this on. So, we're going to pass this and this refers to our PostViewHolder that it's being set on. So, if you look at each post, remember each one is a view holder. 

Each of these is a view holder. So, we're setting it on the one that we're on. So, again, as we just discussed, this requires us to implement the listener. So, you see as I hover over it required view onClickListener. So, I'm going to go over here to my class definition here this line and then add that onClickListener. So, if I start typing in onClickListener, you see I have this one here android.view OnClickListener. So, I'll hit enter on that and you see it gets view.onClicklistener. And this interface OnClickListener has an on click method which we have to implement over here. So, you see now my class PostViewHolder is red it's because of that, because I'm implementing this interface, I need to add that method. So, if I hover over this, I can go to implement members and there is my on click method, when I okay it and it adds it down over here. So, this is where we're going to handle the click  or whatever else we want to do once that button is clicked. So, let's grab the position first. So, val position equals-- remember the property that we used to get this to display earlier, adapterPosition. And then we want to remove this position from our dummy list,

the dummyData that we have. So, I can do this. I can say dummyData but you see this dummyData is red even though I have a property of dummyData which is our list of posts as a property of my adapter, so why is this not recognizing my dummyData list? That's because dummyData is the property of PostAdapter and I am inside a class that's inside my adapter. I'm in class PostViewHolder, that's a class that's within this PostAdapter class. So, by default inside this class I don't have access to the property of my outer class which is my adapter. For this class to have access to properties for the outer class, I have to specify this as an inner class and as soon as I do that you see the red disappears and if I click on it, you see this is highlighted and this is highlighted. So, Android Studio is telling me that this is the same thing, okay? So, now I'm referencing this list. 

And now that I have access to this list, what I can do is ., the method that I want to use is removeAt. That way I can remove the index which will be position but you see this is red as well and why is that? That's because you see right here I have declared my dummyData as a list and a list is read-only. If I want to actually modify this list of posts, then I need to have this as a mutable list, I can say ArrayList, okay? If I make this an ArrayList, so if I actually go back here and press the . and then start typing remove, you see removeAt shows up and then all it needs is the index. So, I'm going to hit 'Enter' over here and what index do I want to remove from my list? Well, the object at position. So, I will enter in position over here, and you see I have no more errors and that'll take care of removing the post object from my list. However, that's not enough. 

Now that the list is updated, remember this is just the dummyData list that we're using as the data source. Now that the list is updated and the post is removed, I still have to let my adapter know that this has taken place. Remember our RecyclerView adapter is managing all the views and everything and doing a lot of work behind the scenes, so it needs to be aware that the list has been updated. So, how do we do that? Well, we can reference our PostAdapter object, so this. And as soon as I type in this, you see this PostAdapter, this is the object, this @PostAdapter. So, the PostAdapter object that I'm working with, I want to notify that the item has been removed. 

So, if I put a dot there you see all these methods pop up, notifyItemRemoved, notifyItemChanged. I want to use this notifyItemRemoved and then I have to specify the position from which it has been removed, okay? And that's it. And this notifyItemRemoved will also give us some nice animation when the post is removed from the app screen. So, let's go ahead and test this out. I'm going to run app, pull up my emulator. All right, we're ready to go. So, let's pick one to delete. How about this one, title of post 4, body of post 4. Let's tap on this. There we go, and you see the nice animation with the rest of the list of posts moving up. All right, let's delete another one. How about 11? Let's tap on this trash. Perfect, 11 is gone, 4 is gone, so our functionality is working perfectly. 

But the way we have implemented this is not optimal or at least not the desired way of doing this because if you look here in the adapter, we're handling this click and the removal that happens from the adapter itself. But the removal is part of our main activity, right? Usually you want the adapter to just be reusable adapter and any kind of edit, delete or other functionality associated with the activity itself, main activity in this case, should be handled in that activity and that will involve forwarding the click and position information from our adapter to our main activity so we can set up and handle the delete here, okay? That would be the ideal way to do this but we won't do that in this video. 

We'll first take care of the edit functionality in the next video, so we get some more practice and exposure with all of these things that we're doing, which depending on your programming experience could be very new and a lot of class and object related things going on. So, we'll get some more experience before we tackle handling these things in the main activity. All right. So, we'll get started with edit functionality in the next video. I hope you're excited, I'll see you there.