1 00:00:05,240 --> 00:00:11,120 Now that we've got some contact details on our emulators, we can have a look now at how to access those contacts 2 00:00:11,240 --> 00:00:13,070 using a Content Provider. 3 00:00:13,370 --> 00:00:19,100 Now the Contacts app has registered a Content Provider that allows apps to access the phone's contacts, 4 00:00:19,460 --> 00:00:23,610 provided they request the necessary permissions and the user grants them of course. 5 00:00:23,770 --> 00:00:28,440 And we're going to be seeing how to do that as we write this app. So I'm going to start a new Android 6 00:00:28,460 --> 00:00:29,790 Studio project, 7 00:00:30,020 --> 00:00:32,759 so let's call this one Content Provider Example. 8 00:00:38,850 --> 00:00:41,720 As always, include Kotlin support, Next. 9 00:00:41,750 --> 00:00:48,240 We're going to make sure we've got API 17, Next. For this example app we're not going to bother to create our own buttons. 10 00:00:48,330 --> 00:00:49,770 We're going to keep things really simple, 11 00:00:50,030 --> 00:00:53,250 and we'll use the floating action button to load the contacts. 12 00:00:53,250 --> 00:00:59,780 So I'm going to choose a basic activity and click on Next, and the suggested names on this last configuration 13 00:00:59,780 --> 00:01:05,590 screen are OK so I'm going to click on Finish. Now once it finishes creating the project, we're going 14 00:01:05,590 --> 00:01:08,030 to start work on the Content Main 15 00:01:08,170 --> 00:01:13,390 xml file. And the only thing we really want to add to this content_main.xml 16 00:01:13,390 --> 00:01:19,840 file is a ListView, and that ListView's going to be used to display the contacts that we're going to grab 17 00:01:19,840 --> 00:01:24,050 from the Content Provider. 18 00:01:24,100 --> 00:01:28,060 OK so you can see that content_main.xml has loaded automatically. For some reason 19 00:01:28,060 --> 00:01:28,940 it hadn't 20 00:01:29,110 --> 00:01:34,990 then just open it as you would normally open it from here, from the resources section in the layout folder. 21 00:01:35,320 --> 00:01:38,740 And I'm going to just close down the project pane to make a bit more space. 22 00:01:39,040 --> 00:01:43,590 And the other thing I'll do is I'll just open both the design and the blueprint so you can see both. 23 00:01:43,690 --> 00:01:46,360 Now what you're going to do first is delete the Hello World, 24 00:01:46,360 --> 00:01:48,980 the TextView widget, so we won't be using that. 25 00:01:49,120 --> 00:01:51,620 And as I mentioned we're going to be using a ListView widget, 26 00:01:51,750 --> 00:01:57,450 so let's grab that. ListView appears down here under legacy. That's probably an indication, by the way, 27 00:01:57,460 --> 00:02:02,100 that Google are planning to deprecate it at some point. But that's not something I'm worried about 28 00:02:02,200 --> 00:02:07,110 for this simple app, but you may want to consider that possibility though when writing your own apps. 29 00:02:07,310 --> 00:02:09,500 Alright so we're going to grab a ListView, 30 00:02:09,759 --> 00:02:11,560 bring it over here and release. 31 00:02:12,310 --> 00:02:14,930 So we want the ListView to fill the available space. 32 00:02:14,950 --> 00:02:19,870 These buttons up here in the inspector make it easy to add the constraints for us automatically. 33 00:02:24,200 --> 00:02:29,140 So we're going to use all the available space, and the other thing we need to do then, is to set both the 34 00:02:29,140 --> 00:02:30,930 layout width and layout height. 35 00:02:30,990 --> 00:02:33,360 Set those both to match constraint. 36 00:02:33,380 --> 00:02:38,900 So obviously we just set constraints. Alright, then next we want to check the scrollbars and we want to make sure that 37 00:02:38,900 --> 00:02:40,160 they're set to vertical. 38 00:02:40,160 --> 00:02:44,480 So I'm going to come over here and click on scrollbars. They're not set for me in this case so I'm going to click 39 00:02:44,480 --> 00:02:46,170 on vertical, 40 00:02:46,180 --> 00:02:48,510 so we've got a vertical scroll bar there for our ListView. 41 00:02:48,710 --> 00:02:49,120 OK. 42 00:02:49,180 --> 00:02:52,480 So we've got our layout width and layout height both set to match constraint. 43 00:02:52,940 --> 00:02:55,240 So the next thing to do is to change the ID. 44 00:02:55,260 --> 00:03:01,730 We want to actually cause one contact_names because we'll be needing to refer to that in our code. 45 00:03:02,150 --> 00:03:06,020 And now there's one other thing to check, and you can tell this by looking at the screen whether it's 46 00:03:06,020 --> 00:03:07,040 set or not. 47 00:03:07,040 --> 00:03:11,010 And that's the layout_behavior property of the constraint layout. 48 00:03:11,450 --> 00:03:14,960 So obviously we want to come over here and click on the constraint layout. That would be where you set 49 00:03:14,960 --> 00:03:15,380 it. 50 00:03:15,500 --> 00:03:21,110 But if there's a toolbar size space at the top of the layout, which we can see there obviously is in both the 51 00:03:21,110 --> 00:03:24,330 design and the blueprint, then we know that everything's fine. 52 00:03:24,590 --> 00:03:29,300 But if for some reason you need to set that and it's not showing for you, make sure you've clicked on the constraint 53 00:03:29,460 --> 00:03:35,210 layout. Then come over here, view all attributes, and you can do a quick search for this or you can just scroll 54 00:03:35,210 --> 00:03:36,980 down to the relevant section. 55 00:03:37,220 --> 00:03:41,500 So search and I'm going to search for layout behavior. Layout 56 00:03:44,340 --> 00:03:46,210 behavior's in layout_margin there, 57 00:03:46,210 --> 00:03:50,070 so there's the layout behavior. And you can see in this case - you can't quite read it all - 58 00:03:50,100 --> 00:03:55,840 but it is actually set to appbar scrolling, or appbar underscore scrolling underscore view underscore 59 00:03:55,880 --> 00:03:56,840 behavior. 60 00:03:58,150 --> 00:04:01,420 So if it's not set for some reason just click there, and then click on the little ellipses button and you 61 00:04:01,420 --> 00:04:05,890 could choose the appbar_scrolling_view_behavior. 62 00:04:05,990 --> 00:04:09,520 But in my case, because we can see the toolbar at the top we know that that is set. 63 00:04:09,550 --> 00:04:10,960 So that's good to go. 64 00:04:11,480 --> 00:04:14,320 Alright so that's the layout finished at this point. 65 00:04:14,410 --> 00:04:15,700 So I'm going to come back in here and just, 66 00:04:20,959 --> 00:04:23,820 I'll just make sure that they're set correctly. 67 00:04:24,100 --> 00:04:24,450 We got that weird error. I'm not sure if 68 00:04:29,690 --> 00:04:34,180 that's a bug or what's going on there, but we seem to have two versions of match constraint showing there. 69 00:04:35,270 --> 00:04:36,650 Let's go back and select the other one, 70 00:04:39,880 --> 00:04:41,700 and that seems to fix it. So I'm not sure what's going on there, 71 00:04:41,710 --> 00:04:44,820 but if you do see something like that - that looks like a bug to me - 72 00:04:44,920 --> 00:04:51,130 just make sure you set the other match constraints so that it actually works and fixes the text, fixes the 73 00:04:51,160 --> 00:04:52,200 xml rather. 74 00:04:52,450 --> 00:04:58,540 Alright, select that xml now and click on Code and select Reformat Code, even though there wasn't 75 00:04:58,540 --> 00:05:04,660 really much to format. It's there so that when you get to the stage of needing to compare your code with ours, it's 76 00:05:04,660 --> 00:05:08,000 going to be the same. Alright so now that I've reformatted the code, 77 00:05:08,010 --> 00:05:12,900 we can move onto the layout for the individual items that'll appear in the ListView. 78 00:05:12,930 --> 00:05:17,370 Now if you want to experiment with displaying more fields from the Contacts database once we finish this 79 00:05:17,370 --> 00:05:21,170 app, then please do. It's always a good idea to experiment. 80 00:05:21,180 --> 00:05:25,830 That's a great way to further your understanding of Android app development or any programming language 81 00:05:25,830 --> 00:05:27,570 or environment for that matter. 82 00:05:27,730 --> 00:05:32,620 And it really will help you make sure that you, really will help make sure you understand these videos. 83 00:05:32,910 --> 00:05:35,180 But I'm just going to display a single field though, 84 00:05:35,410 --> 00:05:37,000 the Contact's name. 85 00:05:37,170 --> 00:05:42,510 So in this next layout we're about to create, I'm going to open the project pane first. Then we're going to right 86 00:05:42,510 --> 00:05:49,710 click on the layout, New, I'm going to select Layout resource file. So because we're displaying just a single 87 00:05:49,710 --> 00:05:50,690 contacts name, 88 00:05:50,790 --> 00:05:54,280 we only need the one field and we're just going to use a TextView. 89 00:05:54,420 --> 00:05:59,000 So I'm going to call this one contact_detail. 90 00:06:00,780 --> 00:06:04,610 So the root element I'm going to change is not going to be a constraint layout - it's literally just going to 91 00:06:04,610 --> 00:06:05,960 be a TextView. 92 00:06:06,360 --> 00:06:11,650 So I'm just going to select TextView because it's the single name, and that just saves us having to change it again 93 00:06:11,780 --> 00:06:13,540 anytime later. 94 00:06:13,770 --> 00:06:17,370 Alright, so first thing we want to do is come over here and click on the TextView, and I'm just going 95 00:06:17,370 --> 00:06:24,270 to close the project pane so we've got a bit more space back. So selecting TextView over here to the left under the component tree - the 96 00:06:24,280 --> 00:06:34,220 ID initially - we'll call that name. We're going to also add some sample text - TextView - in the tools text property. 97 00:06:34,250 --> 00:06:40,700 We talked about what that does before. So that way they'll still show up in the layout but the TextView won't 98 00:06:40,700 --> 00:06:42,150 contain the sample text 99 00:06:42,170 --> 00:06:50,120 when the app runs. So the layout width and height - layout width is correct on match parent but layout height should be changed. 100 00:06:50,120 --> 00:06:55,550 We want that to be wrap content, and the reason we're doing that is to allow very long names to 101 00:06:55,550 --> 00:06:56,550 still fill OK. 102 00:06:56,900 --> 00:06:57,860 So that's all we really need. 103 00:06:57,860 --> 00:07:03,240 But what I will do is do one other thing and change the text size to 18 - make it a bit bigger than normal. 104 00:07:04,290 --> 00:07:09,170 Now text size doesn't appear straight away. Make sure you're expanding the textAppearance section 105 00:07:09,180 --> 00:07:11,940 here so that you can see that. Alright so that's it. 106 00:07:11,990 --> 00:07:13,890 As you can see it's a very basic layout. 107 00:07:13,930 --> 00:07:18,700 What I'll do now is, I'm just going to get access to the text, to the xml again, select that. I'm going to 108 00:07:18,700 --> 00:07:27,590 reformat the code. Go back to design again, and I'm going to close this layout file now. OK so I want 109 00:07:27,590 --> 00:07:32,960 to close that. I'm going to close this other content_main as well, just leaving just purely our Kotlin code. 110 00:07:33,590 --> 00:07:40,180 OK, so we're now ready to add the Kotlin code to retrieve the contact's data, using a Content Provider and 111 00:07:40,190 --> 00:07:41,800 we'll do that in the next video.