1 00:00:00,420 --> 00:00:06,450 Welcome back and this video, we are going to implement a little feature which will allow us to use 2 00:00:06,450 --> 00:00:07,180 something on the map. 3 00:00:07,200 --> 00:00:08,700 For now, it will just be the map. 4 00:00:08,710 --> 00:00:10,890 So we will see a map activity. 5 00:00:11,070 --> 00:00:16,920 But later on, we will add the feature, which allows us to view the actual location of this happy place 6 00:00:16,920 --> 00:00:17,610 on the map. 7 00:00:17,910 --> 00:00:18,330 All right. 8 00:00:18,340 --> 00:00:23,310 So that's what we're going to build for now and therefore we need to create a new activity. 9 00:00:23,340 --> 00:00:25,080 So let's go ahead and do that. 10 00:00:25,110 --> 00:00:29,010 I'm going to create an empty activity, which I'm going to call map activity. 11 00:00:30,810 --> 00:00:37,200 And then in the manifest, or first of all, here, you can see are has to be imported, so it doesn't 12 00:00:37,200 --> 00:00:38,370 know our. 13 00:00:39,320 --> 00:00:47,870 Direction for our the directory, and then the next thing is that we go to our manifest and here I'm 14 00:00:47,870 --> 00:00:52,360 just going to set up the same settings as for the other activities. 15 00:00:52,360 --> 00:00:58,640 So custom, no bar theme or no action bar theme, it will be portrayed and here, happy place. 16 00:00:59,840 --> 00:01:05,600 OK, so then the next thing is going to be is to design the activity map. 17 00:01:05,610 --> 00:01:12,600 So this activity map XML because in here I want to use a map fragment. 18 00:01:12,920 --> 00:01:16,220 So here, first of all, we should have a toolbar. 19 00:01:16,700 --> 00:01:21,080 So let's just add a toolbar as we've done in other cases. 20 00:01:21,500 --> 00:01:23,390 So it's pretty much the same thing. 21 00:01:23,420 --> 00:01:29,330 The only difference to other toolbars that we've created so far is the ID here will be toolbar on the 22 00:01:29,330 --> 00:01:30,400 score map. 23 00:01:30,770 --> 00:01:38,330 And now in here I would like to create a map fragment and in order to do so, you can just use the fragment 24 00:01:38,330 --> 00:01:42,080 keyword and then you have to assign a width. 25 00:01:42,080 --> 00:01:45,870 So I'm going to say it should match its parent in both directions. 26 00:01:45,890 --> 00:01:48,890 I'm going to give it an ID, which I'm going to call map. 27 00:01:50,240 --> 00:01:57,470 And then on top of that, I want to assign the constraints. 28 00:01:57,890 --> 00:01:59,830 It's going to be the following ones. 29 00:02:01,340 --> 00:02:06,440 So bottom to bottom of parent, end to end of parent, start to start of parent and top to bottom of 30 00:02:06,440 --> 00:02:06,920 toolbar. 31 00:02:06,920 --> 00:02:10,870 So it should be underneath the toolbar there. 32 00:02:10,870 --> 00:02:16,970 There's one more setting that we need to add here, and that is we can assign a class here, which I'm 33 00:02:16,970 --> 00:02:26,450 going to assign to conduct Google Dot Android to GM's maps that support map fragment. 34 00:02:28,500 --> 00:02:33,240 Because we want this fragment to eventually be our map, our Google map. 35 00:02:33,840 --> 00:02:34,320 All right. 36 00:02:35,540 --> 00:02:44,300 OK, so then in our activity, happy place detail, so in the resources, I would like to add a button. 37 00:02:44,490 --> 00:02:46,400 So let's go to this layout. 38 00:02:49,810 --> 00:02:52,270 And add a button to the very bottom. 39 00:02:52,600 --> 00:02:58,180 OK, so here it should be inside of the scroll view and inside of the constraint layout, but it should 40 00:02:58,180 --> 00:03:04,120 be underneath the lowest tax to you or dipsticks to you, which is our TV location. 41 00:03:04,510 --> 00:03:10,360 So in here, I would like to have this button and it's going to be a generic button so you can see. 42 00:03:11,610 --> 00:03:14,460 Much parent, and it's with so it's going to be pretty wide. 43 00:03:14,550 --> 00:03:16,760 It's just going to be as high as it requires. 44 00:03:16,770 --> 00:03:17,880 It's going to be centered. 45 00:03:18,250 --> 00:03:19,850 It's going to have margins. 46 00:03:19,860 --> 00:03:25,680 And the background should be a shape button around it, which we have used before. 47 00:03:25,690 --> 00:03:30,420 And so we created this back in the day and another lecture. 48 00:03:30,630 --> 00:03:34,960 And as you can see, there are a bunch of new dimensions and also new strings. 49 00:03:34,960 --> 00:03:37,620 So the textured button takes view on map. 50 00:03:37,860 --> 00:03:43,530 So let's add all of those dimensions and also those strings to our project. 51 00:03:45,060 --> 00:03:51,600 So here in dimension's, as you can see, we have already and many different dimensions, and here this 52 00:03:51,600 --> 00:03:59,480 one will be putting you on margin stardate density pixels, margin top 16, putting top to bottom eight 53 00:03:59,490 --> 00:04:03,270 density pixels and textiles will be 18 Hespe. 54 00:04:05,130 --> 00:04:11,730 And then we had one string, so let's go to strings and add that one string, which was just a button 55 00:04:11,730 --> 00:04:12,210 text. 56 00:04:12,570 --> 00:04:15,630 So button text view on map. 57 00:04:16,230 --> 00:04:16,870 View on map. 58 00:04:18,430 --> 00:04:25,900 And now we just need to give this button your map, which we just created, which is in our activity, 59 00:04:25,900 --> 00:04:27,310 happy place here. 60 00:04:27,340 --> 00:04:30,570 This one, we need to give it an unclick listener. 61 00:04:30,610 --> 00:04:32,160 So on which page is it? 62 00:04:32,170 --> 00:04:35,610 Well, it's on the happy place detail activity. 63 00:04:35,770 --> 00:04:36,950 So let's just go there. 64 00:04:37,420 --> 00:04:39,360 Happy place, detail activity. 65 00:04:40,120 --> 00:04:43,780 And here we will add another listener to it. 66 00:04:44,410 --> 00:04:48,480 So as we've done with the other ones, we're just going to keep it simple here. 67 00:04:49,000 --> 00:04:49,510 So. 68 00:04:50,710 --> 00:04:57,570 Just going to say putten view on a map set on Click Listener. 69 00:04:59,450 --> 00:05:01,910 And then we use the curly brackets here. 70 00:05:02,780 --> 00:05:04,280 I just want to have an intent here. 71 00:05:06,670 --> 00:05:09,640 Which will open up the map activity. 72 00:05:09,940 --> 00:05:11,800 So here we need to import intent. 73 00:05:13,680 --> 00:05:21,840 And then we need to put this into context, so I'm going to pass on this and also the activity that 74 00:05:21,840 --> 00:05:24,350 we want to go to, which is our activity, right. 75 00:05:24,540 --> 00:05:28,370 So map activity class that Jabhat. 76 00:05:30,730 --> 00:05:33,760 All right, and then the next thing is, of course, to start this intent. 77 00:05:34,840 --> 00:05:41,620 But I also want to pass something, so when I click on this, I want to give this intern some extra 78 00:05:41,620 --> 00:05:51,090 information, which will be our main activity, that extra place details. 79 00:05:51,100 --> 00:05:53,700 So let's get them here. 80 00:05:54,040 --> 00:05:56,950 Extra place details. 81 00:06:01,890 --> 00:06:05,350 And the detail itself will be our happy place detailed model. 82 00:06:05,550 --> 00:06:11,250 So this object that we created earlier on, which is this one here. 83 00:06:13,070 --> 00:06:20,900 All right, so we passed that as well into intent and then we start the activity, start activity with 84 00:06:20,900 --> 00:06:21,550 this intent. 85 00:06:21,620 --> 00:06:22,250 We prepared. 86 00:06:24,580 --> 00:06:30,340 All right, at this point, we should be able to get this running and test the functionality. 87 00:06:32,540 --> 00:06:37,110 All right, there we had our test one, and you can see the view on my is there. 88 00:06:37,130 --> 00:06:38,000 Let's click on it. 89 00:06:40,960 --> 00:06:43,840 And let's see if the map opens and there you are. 90 00:06:44,140 --> 00:06:48,940 So the Google Maps activity opened up and now we can see the map. 91 00:06:48,950 --> 00:06:50,770 Of course, we don't have any controls. 92 00:06:50,770 --> 00:06:53,220 We don't have any additional detail. 93 00:06:53,470 --> 00:06:56,770 And as you can see, there is no action bar here. 94 00:06:56,770 --> 00:07:04,120 And that is because I didn't assign the right height here for this button and this activity map. 95 00:07:04,420 --> 00:07:10,900 So here I used my parents, but we could, of course, also use zero density pixel so that our toolbar 96 00:07:10,900 --> 00:07:12,160 still has some space. 97 00:07:13,690 --> 00:07:17,500 So testing that once again and going to our map. 98 00:07:19,340 --> 00:07:21,170 We can see now the toolbar is still there. 99 00:07:22,760 --> 00:07:29,480 All right, so now that we have the map here, it's time to display the right location on the map, 100 00:07:30,500 --> 00:07:33,090 so let's add a little marker to it and the next video. 101 00:07:33,110 --> 00:07:33,620 See you there.