 Hello everyone. So this week's topic is the recycler view and it's counterpart the card view So recycler views are a pretty cool thing. They're in Probably just about any Android application. You have used lately. So let's get into it and just give you a quick introduction of these things They're actually pretty complicated, but they're very cool looking once you get them going alright So what is the recycler view the recycler view is a list of information But on steroids right so if you're in a position where you need to display a bunch of different things if you want just like a list of Text options like if you're selecting things from which pizza you want or something like that But it's real boring information. There are other things you can use you can use a list view with a list adapter Those things are great But if you want to have nice customized lists of information, right? Not just words, but maybe you've got pictures or icons or things like that. You want a recycler view Okay, it's got a couple of things for it As I mentioned before I think recycler view is Android's preferred way of showing lists of items So when you go to the Android documentation these days, you'll see that they use recycler views in their examples The recycler view has a lot of benefits. So first of all what you want to show in your list of Stuff what is an item in a list? What does it mean to you? That is totally customizable by you It can be a list of images of texts of icons all three a Recycler view has a couple of different Layouts for its list of information. I'll show you them in another slide and it Really importantly, this is the reason Android it pushes it so much is it Intelligently recycles the widgets that are on the screen. That's why it's called a recycler view So what do I mean by recycling widgets? I mean that drawing widgets is Expensive right actually putting things on the screen is expensive sizing it figuring out if stuff fits all that sort of stuff Android in a recycler view takes the widget remembers it remembers its dimensions and its layout things like that but replaces the content right now in a list This is kind of what it well in a list this can be important because you know say you've got An Instagram with like a thousand different pictures in it, right? It's more efficient to like say And this is a recycler view by the way and what it's displaying is a list of little pictures here Say there's a thousand pictures on this person's account the way the recycler view kind of does things differently is I see nine Tiles here and these are my list elements What it does is it kind of figures out the dimensions of these nine tiles and and their padding and their margin and all that good stuff But then as you like scroll up or scroll down and you put different pictures on the screen The recycler view put changes the content of the widget But really it uses the same widget object like the same Java class object, but replaces its variable data and This is recycling it recycles the objects by putting different data in there Why is that a good thing? Well if this person has a thousand pictures on their Instagram account You don't want Android like downloading all thousand at one time at once and building a thousand different widgets, right? And there's two inefficiencies to that one is you've got to download a thousand things Okay. Well, maybe I'll just make my program smart and not download a thousand. Maybe I'll just get the first 32 64 or whatever But there's also inefficiency in creating those thousand widgets even if you're only creating them on demand, right? So that's kind of the power of the recycler view on the downside the recycler view is It's a little tedious to set up it's a little tricky a little more complicated than any other view we have looked at and capturing Interactions like if you click on this particular picture Capturing interactions inside a recycler view is a little tangled but totally doable As I mentioned there are a couple of different layout options for the recycler view These are all examples of recycler views. So I think this is maybe the Kindle app These are items in the list, right? These are in a linear fashion You've got grid layouts like we've got here and what is called a staggered grid where things can kind of You know, there's two columns here, but the number of rows is sort of variable, right? You've probably all seen examples of these All right, so that's the recycler view the recycler view is like a layout handler for lists Okay, it puts a list of things on the screen The actual content that we have seen in this picture and in these pictures here Those are card views now a card view is a widget and it's meant to display things right and it's very flexible It is sort of the ultimate metaphor in material design If you remember from the last video when we talked about material design the material in Material design is paper card stock that lay is laying on a surface, right? so a card view is Meant to represent a piece of card stock with something on it laying on a surface The cards are elevated on the background using drop shadow. You can round these corners if you like But the content what actually goes in the card right the card is a rectangle That's the main thing about it and the content is specified in a layout file Just like you do with like your whole activities, right? so it's it's just like a tiny little square that you have a lot of control over what goes inside of it, right and The recycler view is Really good at reusing these things it kind of expects these card views in them, right? And they're they're pretty cool. They're pretty powerful and again They're sort of like de facto how Android wants you to display lists of information if using this card view, okay? So all these Example apps we've got like the Google photo app Here's the score sports news Each of these things, you know each picture here and Google photos is a card view, right? And then they even have like slightly different customizable data. There's obviously the picture is different some of them are movies, right? So this has a time stamp and a little play icon. This one is not a movie So it doesn't have those things that stuff that you can program and control with your card view So pretty cool stuff, but it is intensely flexible This thing right here. So you got this picture of this the coach for the New York Jets or former coach and then Down below it. You've got or excuse me up above it You've got kind of like a title and down below it You've got the share button or send a button this whole thing right here is actually a card view So the card itself is kind of like a layered complex thing the card view can contain Other layouts like maybe this is a linear layout to give you the things stacked up all nicely Okay, but the card is an entire entity same thing over here, right? Here's some travel website for looks like Australia They've got a picture up at the top this one whole thing right here is a card Right, they've got a picture up at the top with a title and some shadowy background some text down here two buttons All this stuff is a card, right? So a card is kind of like a Mini layout file for an activity, right? You have control and you format it just like an activity screen you would do, okay? So very powerful very cool very flexible I Want to introduce you to I'm gonna get rid of myself here I want to introduce you to a roadmap for working with these things now in this video This is all probably not gonna make a lot of sense So what I want you to do is go do the lab for this chapter chapter 13 of your book Do the Google official Android exercises on recycler view in the card view that are linked in your module and then come back to the Slide because it's important for you to understand how the pieces get connected in the code It'll help you debug things a lot better when you run into some weird errors when you set up these things, okay? so the recycler view right you've got an activity and This is true for any Activity in your app. You've got your on create method the first thing that happens in on create as you do set content view and You point it to the layout file for the activity, okay? Inside the main activity. You've got some sort of parent layout here I've got a linear layout and inside the parent layout Which could be a constraint layout you have a recycler view widget, right? All right, so this is saying all right when you call set content view Fire up this recycler view load it into memory and let's get to work on it alright Now couple steps down the layout manager You're gonna set that that decides is this a grid layout is it a linear layout for your recycler and then set Adapter, okay, so what is an adapter an adapter is a design pattern in software development What the adapter does is it provides a Window onto some data Okay It is it's like the bridge. It's the translator. So say you've got a whole bunch of raw Information about like a person's Instagram post. It's got the date the time the name the picture that's associated with it Some comments etc etc etc. That's the raw data What adapters do in general in computing is they're gonna take that raw data and they're gonna Maybe manipulate it maybe omit some of it to provide the necessary information the necessary data to Some consumer of that data And so in this case the consumer of the data is going to be the recycler view It's gonna show the data the captioned images adapter Here and this is just the name for the one that I use but it is an adapter the captioned images adapter Its job is to kind of take the raw data and build up some information to give to the recycler view okay, so when what happens here is When the captioned image it image adapters attached to the recycler view It has a thing called a view holder in it Okay, the way to think of the view holder is that it's like the grid the blueprint on the screen It's this thing but without any content in it. Okay, so you're telling the recycler view. Hey, there's a grid it's for wide and Four columns wide and two rows high. Okay That's where you're gonna put stuff mr. Recycler view. Okay, and what are you gonna put in here? Well, you're gonna put one of these You're gonna inflate and put in one of these card things. Well, what is the card? That is the card view that gets specified in this XML file. Okay, so mr What you're saying here is mr. Recycler view. Here's an adapter The adapter is gonna give you These things these kind of like empty spaces the reusable recycled things And it's gonna provide to you the specific data that goes into each specific thing As you as the user is like swiping up and down and scrolling through the list. Okay, so When you initialize the adapter You create the view holder the grid the whatever that's gonna hold these things and then finally Whenever the adapter whenever the recycler view is actually drawn on the screen This gets triggered on bind view holder and on the bind view holder Fills each member of this grid with its particular data Okay, so effectively the grid will stay the same But imagine I've got a whole bunch more pictures down here as the user swipes up and down The content of the grid will change, but the grid will always kind of be there all right, so Yeah, that's a lot to digest a little confusing come back to this part of the video come back to the slide after you've Worked through the chapter see if this helps you out a little bit. All right. That's it for this module Introduction and I will talk to you next time