1 00:00:05,200 --> 00:00:07,490 In this video we'll create the adaptor 2 00:00:07,490 --> 00:00:10,870 for our RecyclerView so that it displays the tasks 3 00:00:10,870 --> 00:00:12,210 in the database. 4 00:00:12,210 --> 00:00:14,210 RecyclerView displays views as we saw 5 00:00:14,210 --> 00:00:15,410 in the Flickr Browser app 6 00:00:15,410 --> 00:00:17,460 and we need an adapter that sits 7 00:00:17,460 --> 00:00:21,670 between the RecyclerView and the data we want to display. 8 00:00:21,670 --> 00:00:23,910 Google had produced a cursor adaptor class 9 00:00:23,910 --> 00:00:26,896 that provides data from a cursor to a list view 10 00:00:26,896 --> 00:00:28,830 but they haven't provided a version 11 00:00:28,830 --> 00:00:30,700 that works with the RecyclerView. 12 00:00:30,700 --> 00:00:32,000 Well that's not the end of the world 13 00:00:32,000 --> 00:00:33,520 because it's not really that difficult 14 00:00:33,520 --> 00:00:36,660 to extend the RecyclerView.AdapterClass 15 00:00:36,660 --> 00:00:38,150 to work with a cursor. 16 00:00:38,150 --> 00:00:41,680 In the Flickr Browser app the adaptor used a list 17 00:00:41,680 --> 00:00:43,560 to store the photo details. 18 00:00:43,560 --> 00:00:46,370 What we'll do is create a cursor RecyclerView adaptor 19 00:00:46,370 --> 00:00:48,417 along the same lines or on similar lines 20 00:00:48,417 --> 00:00:53,140 but the data will come from a cursor instead of a list. 21 00:00:53,140 --> 00:00:55,350 We're gonna start by creating a new Katlin class. 22 00:00:55,350 --> 00:00:57,150 So let's go ahead and do that. 23 00:00:57,150 --> 00:00:59,160 Obviously you're aware of this I would think by now. 24 00:00:59,160 --> 00:01:02,710 Alright so you're gonna right click on tasktimer, new, 25 00:01:02,710 --> 00:01:04,530 Katlin File/Class and we're gonna call 26 00:01:04,530 --> 00:01:07,663 this one the CursorRecyclerViewAdapter. 27 00:01:10,590 --> 00:01:11,520 We're gonna take the opportunity 28 00:01:11,520 --> 00:01:13,490 to select Class on a kind just 29 00:01:13,490 --> 00:01:16,350 to select or to save rather a little bit of time. 30 00:01:16,350 --> 00:01:17,610 Alright, so we want this class 31 00:01:17,610 --> 00:01:19,963 to extend the RecyclerView.AdapterClass 32 00:01:20,917 --> 00:01:24,130 so that we can use it as an adapter for RecyclerView. 33 00:01:24,130 --> 00:01:26,700 And it will be returning task view holder object. 34 00:01:26,700 --> 00:01:28,950 So let's go ahead and do that first. 35 00:01:28,950 --> 00:01:31,050 So we got a colon there to extend 36 00:01:31,050 --> 00:01:34,030 and then on the next line we'll indent it a little bit. 37 00:01:34,030 --> 00:01:38,520 It's gonna be RecyclerView.Adapter 38 00:01:38,520 --> 00:01:40,170 and I'll just except that import. 39 00:01:42,220 --> 00:01:44,360 And it's as I mentioned we're going 40 00:01:44,360 --> 00:01:46,050 to be returning task view object. 41 00:01:46,050 --> 00:01:48,550 So in the less than greater than sign 42 00:01:48,550 --> 00:01:50,157 in other words the don't have to write up everything there. 43 00:01:50,157 --> 00:01:53,317 I'm gonna type in, we'll type, TaskViewHolder. 44 00:01:54,412 --> 00:01:57,990 And we need to add parenthesis after the greater than sign 45 00:01:57,990 --> 00:02:00,530 and then left and right curly braces for the class. 46 00:02:00,530 --> 00:02:02,910 I'm just gonna delete the extra two that were sitting there. 47 00:02:02,910 --> 00:02:06,380 Alright so I'm gonna add our constant which is for our tag. 48 00:02:06,380 --> 00:02:10,270 So it's going to be private const val 49 00:02:10,270 --> 00:02:15,037 and it's gonna be TAG = double quotes CursorRecyclerView, 50 00:02:17,970 --> 00:02:20,313 I'm not gonna type the whole word just Adapt. 51 00:02:21,320 --> 00:02:23,170 And we're doing it to be careful with the log in TAG 52 00:02:23,170 --> 00:02:25,240 because if you make the TAG string longer 53 00:02:25,240 --> 00:02:27,800 than 23 characters things can go wrong. 54 00:02:27,800 --> 00:02:29,650 So that's why I've truncated it. 55 00:02:29,650 --> 00:02:31,350 And in reality if you're doing this 56 00:02:31,350 --> 00:02:33,910 you're probably shortening entire class name 57 00:02:33,910 --> 00:02:36,710 to something along the lines cursor of the adapter. 58 00:02:36,710 --> 00:02:38,790 But then I wouldn't have had an excuse to remind you 59 00:02:38,790 --> 00:02:41,460 about the propers with the long log tags. 60 00:02:41,460 --> 00:02:42,450 Alright so we've got an error 61 00:02:42,450 --> 00:02:44,470 because we haven't written the methods we need yet 62 00:02:44,470 --> 00:02:46,900 but even when we have we'll get another error 63 00:02:46,900 --> 00:02:48,840 because the task view holder class 64 00:02:48,840 --> 00:02:50,530 of course doesn't exist yet. 65 00:02:50,530 --> 00:02:52,490 So let's start by creating that. 66 00:02:52,490 --> 00:02:54,470 Then we can forget about it for now anyway. 67 00:02:54,470 --> 00:02:56,560 So we're going to do that basically 68 00:02:56,560 --> 00:02:58,662 above the const definition there. 69 00:02:58,662 --> 00:03:01,273 So I'm gonna come up here and start this on line 10. 70 00:03:01,273 --> 00:03:05,980 So it's gonna be class and it's TaskViewHolder 71 00:03:05,980 --> 00:03:09,490 and we want parenthesis val containerView: 72 00:03:12,420 --> 00:03:15,230 and I can type in View because that's what it is. 73 00:03:15,230 --> 00:03:17,153 It's a view, except the import. 74 00:03:18,120 --> 00:03:20,660 Then we need to extend, so colon. 75 00:03:20,660 --> 00:03:23,490 Now on the next line just indent it a bit 76 00:03:23,490 --> 00:03:24,550 so that it's more readable 77 00:03:24,550 --> 00:03:28,610 and it's gonna be RecyclerView.ViewHolder this time. 78 00:03:28,610 --> 00:03:30,809 What we're extending and in parenthesis 79 00:03:30,809 --> 00:03:33,100 it's going to be our containerView 80 00:03:33,100 --> 00:03:34,630 which of course is the argument. 81 00:03:34,630 --> 00:03:36,690 And we want left and right curly braces. 82 00:03:36,690 --> 00:03:38,090 And in terms of the code, 83 00:03:38,090 --> 00:03:42,073 we're gonna type in there is var name: Textview = 84 00:03:45,792 --> 00:03:47,677 and it's going to be containerView 85 00:03:47,677 --> 00:03:50,193 and I miss typed Textview there so I change that to TextView 86 00:03:50,193 --> 00:03:53,590 with a capital V of course is the right one. 87 00:03:53,590 --> 00:03:55,943 And it's containerView.findViewByID 88 00:03:58,549 --> 00:03:59,833 and it's gonna be R.id.tli_name, okay. 89 00:04:05,986 --> 00:04:08,370 I'll just delete that extra line there. 90 00:04:08,370 --> 00:04:12,050 Now hang on a minute what's this findViewByID in Katlin. 91 00:04:12,050 --> 00:04:15,920 Well yes, unfortunately the Katlin extensions only work 92 00:04:15,920 --> 00:04:19,839 by default in activity fragment and view classes. 93 00:04:19,839 --> 00:04:21,360 The obvious thing to do here is 94 00:04:21,360 --> 00:04:23,020 to add the description property 95 00:04:23,020 --> 00:04:26,570 and the two buttons calling findViewByID for each one. 96 00:04:26,570 --> 00:04:28,940 That would work but frankly it's boring. 97 00:04:28,940 --> 00:04:30,480 You already know how to do that. 98 00:04:30,480 --> 00:04:32,120 We did it in the Flickr Browser app 99 00:04:32,120 --> 00:04:33,910 and it's pretty standard stuff. 100 00:04:33,910 --> 00:04:35,580 And most of the examples you find 101 00:04:35,580 --> 00:04:37,800 on the internet will also be doing it that way. 102 00:04:37,800 --> 00:04:39,900 So what I'm going to do is take this opportunity 103 00:04:39,900 --> 00:04:42,890 to show you a more Katlin like way of doing it. 104 00:04:42,890 --> 00:04:44,820 So let's have a start or let's start by having a look 105 00:04:44,820 --> 00:04:47,730 at the layout extensions in the Katlin documentation. 106 00:04:47,730 --> 00:04:50,823 So bring that up on screen, we'll open a browser. 107 00:04:54,340 --> 00:04:57,470 Now firstly note these are experimental. 108 00:04:57,470 --> 00:04:59,870 We've already used the past implementation 109 00:04:59,870 --> 00:05:02,630 and we've talked about the experimental features. 110 00:05:02,630 --> 00:05:06,150 LayoutContainer Support is another experimental feature 111 00:05:06,150 --> 00:05:07,590 that's worth looking at here. 112 00:05:07,590 --> 00:05:10,040 Now if for some reason LayoutContainer doesn't make it 113 00:05:10,040 --> 00:05:14,000 into production we can just go back to using findViewByID. 114 00:05:14,000 --> 00:05:17,050 We're learning here, we're not producing a production code 115 00:05:17,050 --> 00:05:19,790 so I'm happy to show you these useful Katlin features. 116 00:05:19,790 --> 00:05:21,310 But take that warning so you can see 117 00:05:21,310 --> 00:05:23,020 on screen in that first paragraph though. 118 00:05:23,020 --> 00:05:25,460 Seriously though, if you're working on an app that's going 119 00:05:25,460 --> 00:05:28,940 to be released then don't turn on the experimental mode. 120 00:05:28,940 --> 00:05:32,060 Alright, so moving down the screen LayoutContainer Support 121 00:05:32,060 --> 00:05:35,740 so as it says virtually any class can be turned 122 00:05:35,740 --> 00:05:38,620 into an Android Extensions container. 123 00:05:38,620 --> 00:05:40,750 Example code shows us how to do that. 124 00:05:40,750 --> 00:05:42,850 So let's do it back in our TaskViewHolder. 125 00:05:43,730 --> 00:05:45,430 So we'll go back to Android Studio 126 00:05:47,170 --> 00:05:48,890 and we'll do the same thing effectively. 127 00:05:48,890 --> 00:05:52,540 So I'm gonna start by changing the definition on line 12. 128 00:05:52,540 --> 00:05:55,380 For the argument we're gonna put an override there. 129 00:05:55,380 --> 00:05:59,420 So override val container, our container colon View 130 00:05:59,420 --> 00:06:03,149 then we need to add a comma to the 131 00:06:03,149 --> 00:06:06,180 after the right parenthesis on line 13 132 00:06:07,090 --> 00:06:11,287 and then we need to add LayoutContainer just interface. 133 00:06:13,570 --> 00:06:16,510 And now that I've done that I can actually delete line 16 134 00:06:16,510 --> 00:06:17,410 which I'll do now. 135 00:06:18,630 --> 00:06:21,230 So effectively that leaves an empty class body. 136 00:06:21,230 --> 00:06:24,773 And Android Studio suggests that we actually delete that. 137 00:06:25,740 --> 00:06:27,770 You see its got the suggestion there for us. 138 00:06:27,770 --> 00:06:29,450 But I won't do that now because we'll be adding 139 00:06:29,450 --> 00:06:31,930 another function to this class a little bit later. 140 00:06:31,930 --> 00:06:34,060 But that's it, that's all we need at the moment. 141 00:06:34,060 --> 00:06:35,470 We're going to be adding on click lists 142 00:06:35,470 --> 00:06:37,970 for the buttons later but we don't have to bother 143 00:06:37,970 --> 00:06:40,810 with all those findViewByID calls which is pretty cool. 144 00:06:40,810 --> 00:06:42,950 So let's just see, we've now got a reference 145 00:06:42,950 --> 00:06:45,150 to the tli and it's code name TaskView 146 00:06:45,150 --> 00:06:47,310 just like we have in our activities. 147 00:06:47,310 --> 00:06:50,100 But the question here is will it work? 148 00:06:50,100 --> 00:06:51,500 Well we'll see that in a moment. 149 00:06:51,500 --> 00:06:54,400 First though we need to finish the code for the adapter 150 00:06:54,400 --> 00:06:56,513 and we'll work on that in the next video.