1 00:00:00,110 --> 00:00:06,170 Pay everyone in this theater if you're going to go ahead and create another Android application. 2 00:00:06,180 --> 00:00:08,090 So here I just need to click on this. 3 00:00:08,190 --> 00:00:16,350 Start in your Android studio project and for the application name I just need to type in app of 46 and 4 00:00:16,350 --> 00:00:23,000 then click on next year's choose API 16 Android 4.1 jellybean for the minimum SDK and then click on 5 00:00:23,010 --> 00:00:26,430 next and here choose blank activity. 6 00:00:26,520 --> 00:00:27,040 OK. 7 00:00:27,090 --> 00:00:29,770 Next here are click on finish. 8 00:00:30,150 --> 00:00:36,020 So here it lets actually select the hello world view here and then personally live here on your keyboard 9 00:00:36,420 --> 00:00:41,820 and then go inside Israel's fault there lay out activity on the alignment of the exemption and then 10 00:00:41,820 --> 00:00:45,940 select this floating action button and then press on delete key on your keyboard. 11 00:00:46,200 --> 00:00:50,820 So let's actually go back and say this content underline minute example and here we want to actually 12 00:00:50,820 --> 00:00:53,730 design the user interface of our application. 13 00:00:53,730 --> 00:00:59,470 So now let me actually show you more of the application that we want to create in this tutorial. 14 00:00:59,760 --> 00:01:03,930 So as you can see here this is the application that we want to create in this tutorial. 15 00:01:04,140 --> 00:01:09,900 And as you can see here we have a text view here and the taste of this takes is these are the images 16 00:01:09,960 --> 00:01:12,260 of our animals great view. 17 00:01:12,390 --> 00:01:17,490 So we want to use our great view in this application and I want to show you how we can use that great 18 00:01:17,490 --> 00:01:18,880 view in your applications. 19 00:01:19,140 --> 00:01:23,760 And as you can see here at the bottom we have this great view and if you actually scroll down now I 20 00:01:23,760 --> 00:01:24,950 can see the other images. 21 00:01:24,960 --> 00:01:31,200 OK so now as you can see the images are actually are in are great in a great view. 22 00:01:31,200 --> 00:01:31,830 OK. 23 00:01:32,070 --> 00:01:38,370 So and if I actually click on one of these images for example this image it says the name of the animal 24 00:01:38,430 --> 00:01:39,910 is bird. 25 00:01:40,110 --> 00:01:41,680 The name of the animal is cats. 26 00:01:41,700 --> 00:01:42,420 OK. 27 00:01:42,720 --> 00:01:48,290 So we want to go ahead and use a great view in this application. 28 00:01:48,540 --> 00:01:52,160 So let's actually go back and say this content underlined made that example. 29 00:01:52,410 --> 00:01:58,870 And first of all we need to actually drag a linearly out vertical as you can see here into this relatively 30 00:01:58,870 --> 00:01:59,270 healthy. 31 00:01:59,270 --> 00:01:59,670 OK. 32 00:01:59,790 --> 00:02:03,310 So just put it at the center of these relatively out. 33 00:02:03,800 --> 00:02:10,880 And now actually drag our takes few large takes you into These are linearly out vertical. 34 00:02:10,890 --> 00:02:14,270 So put it at the center of this linearly outwards call. 35 00:02:14,390 --> 00:02:14,790 OK. 36 00:02:14,880 --> 00:02:21,990 So as you can see here mistakenly I actually put it at the right place at the right of these linearly 37 00:02:21,990 --> 00:02:23,030 at vertical OK. 38 00:02:23,190 --> 00:02:29,030 So I can just drag it and put it at the center of these linearly linearly vertical. 39 00:02:29,070 --> 00:02:37,200 So here I can just double click on it and for the takes just type in here these are the images these 40 00:02:37,200 --> 00:02:40,460 are the images of our animals in a great view. 41 00:02:40,530 --> 00:02:41,090 OK. 42 00:02:41,400 --> 00:02:47,270 These are the images of our animals integrate view and then press Enter key on your keyboard. 43 00:02:47,280 --> 00:02:48,000 OK. 44 00:02:48,120 --> 00:02:54,340 So let's actually find that gravity the gravity attributes as you can see here. 45 00:02:54,450 --> 00:03:00,400 This is our textfield and the Lyell's gravity attribute of this text is as you can see Center horizontal. 46 00:03:00,460 --> 00:03:01,030 OK. 47 00:03:01,050 --> 00:03:04,990 So these text view is actually at the center of this really vertical. 48 00:03:05,190 --> 00:03:09,930 And now we have actually another attribute called gravity as you can see here. 49 00:03:10,110 --> 00:03:12,650 So this is the this is the gravity attribute. 50 00:03:12,930 --> 00:03:19,080 And if I open this gravity tribute by just clicking on this little triangle here here I need to actually 51 00:03:19,080 --> 00:03:26,850 choose this center horizontal or checkbox and check the street box here and now as you can see this 52 00:03:26,850 --> 00:03:32,970 text view is actually at the center of this text view here as you can see the text is at the center 53 00:03:33,150 --> 00:03:34,270 of the state's view. 54 00:03:34,710 --> 00:03:37,850 And now let's actually increase the size of this view. 55 00:03:37,950 --> 00:03:41,070 So we have a text size here as you can see. 56 00:03:41,220 --> 00:03:44,520 And for the text size assigned the value 6. 57 00:03:45,000 --> 00:03:48,200 Now we can actually specify the color of that of our text view. 58 00:03:48,390 --> 00:03:50,380 So I can just put in a hash tag. 59 00:03:50,550 --> 00:03:56,110 0 0 0 0 F F and then press on and to key on your keyboard. 60 00:03:56,130 --> 00:03:59,940 So as you can see now the color of our text is actually changed. 61 00:03:59,970 --> 00:04:03,690 So now let's actually write up a great view. 62 00:04:03,700 --> 00:04:09,210 So inside these are containers folder we have this great view here as you can see this is the great 63 00:04:09,210 --> 00:04:09,670 view. 64 00:04:09,810 --> 00:04:13,580 So just select it and put it inside this nearly vertical. 65 00:04:14,070 --> 00:04:15,120 As you can see here. 66 00:04:15,330 --> 00:04:16,850 So we have this great view here. 67 00:04:16,890 --> 00:04:19,680 So just as you can see double click on it. 68 00:04:19,710 --> 00:04:25,950 So if you have Nahm columns choice mode as you can see here and single choice multiple choice or multiple 69 00:04:25,950 --> 00:04:26,810 choice model. 70 00:04:26,880 --> 00:04:27,320 OK. 71 00:04:27,420 --> 00:04:28,500 And we have ID. 72 00:04:28,640 --> 00:04:29,070 OK. 73 00:04:29,170 --> 00:04:36,340 So for the ID just type in here g r the view and then present Enter key on your keyboard. 74 00:04:36,750 --> 00:04:40,030 So it's actually inside is a text tap here. 75 00:04:40,320 --> 00:04:45,020 And now let's actually add some attributes for this great view here. 76 00:04:45,400 --> 00:04:46,430 OK. 77 00:04:46,560 --> 00:04:52,350 Now so now I'm going to paste in some lines of code here and then I'm going to explain to you what's 78 00:04:52,350 --> 00:04:53,090 going on here. 79 00:04:53,100 --> 00:04:53,540 OK. 80 00:04:53,670 --> 00:04:58,080 So as you can see here these are the lines of code that I actually pasted here. 81 00:04:58,080 --> 00:04:58,540 OK. 82 00:04:58,680 --> 00:05:01,360 Android Cullom TDP. 83 00:05:01,500 --> 00:05:08,710 So as you can see here inside our emulator here you have this great view here at the bottom OK. 84 00:05:09,000 --> 00:05:10,870 And as you can see we have column Viets. 85 00:05:11,130 --> 00:05:14,960 OK so this is the column of our great view 80. 86 00:05:15,240 --> 00:05:18,690 OK and we have number of columns or two feet. 87 00:05:18,690 --> 00:05:23,260 So the best option for this a number of columns and attributes is her feet. 88 00:05:23,310 --> 00:05:28,580 OK so it can actually automatically fit the columns inside of our great view as you can see here. 89 00:05:28,950 --> 00:05:32,400 And we have vertical spacing so 15 DP. 90 00:05:32,520 --> 00:05:37,300 OK so as you can see here the vertical spacing is up for 15 DP. 91 00:05:37,380 --> 00:05:38,030 OK. 92 00:05:38,580 --> 00:05:41,740 And we have horizontal spacing as you can see here. 93 00:05:41,880 --> 00:05:43,770 Again it is a 15 DP. 94 00:05:44,060 --> 00:05:44,530 OK. 95 00:05:44,640 --> 00:05:50,240 And then we have a column Veith as you can see here we have this threat. 96 00:05:50,550 --> 00:05:53,310 And the value of this stretch more is column Viets. 97 00:05:53,690 --> 00:05:54,230 OK. 98 00:05:54,510 --> 00:06:01,380 So I think for the best option for this stretch more is called invasive and for the gravity the gravity 99 00:06:01,380 --> 00:06:02,310 is at the center. 100 00:06:02,310 --> 00:06:07,900 OK so our Actually our great view is at the center of these linearly elsewhere. 101 00:06:08,060 --> 00:06:08,830 OK. 102 00:06:09,270 --> 00:06:11,050 So hopefully that makes sense. 103 00:06:11,220 --> 00:06:17,880 And now let's actually go back and say this main activity that of fight here and now are let's actually 104 00:06:18,050 --> 00:06:24,490 delete these lines of code that are related to the of the menu options menu here. 105 00:06:24,840 --> 00:06:29,580 And then let's actually delete this block of code that is still related to the floating action button. 106 00:06:29,670 --> 00:06:34,860 So inside of this our main activity class let's actually declare an object of type. 107 00:06:34,860 --> 00:06:37,540 Great view Okay great view. 108 00:06:37,770 --> 00:06:44,440 And the name of this object is g r d view and then put a semicolon at the end of your statement. 109 00:06:44,640 --> 00:06:50,040 And inside of this uncreate method let's actually initialize this great view object so I can just type 110 00:06:50,040 --> 00:06:53,740 in great view or the view assignment operator. 111 00:06:53,910 --> 00:06:58,640 And then here I need to actually cast this object to our great view object. 112 00:06:58,650 --> 00:07:05,400 So I can just typing I can just put a pair of round Prentice's here I can I can't just type in great 113 00:07:05,790 --> 00:07:12,700 view find view by I-T are thought Id dot G are the view. 114 00:07:12,700 --> 00:07:13,300 OK. 115 00:07:13,680 --> 00:07:19,770 And here I actually initialize this object by referring to this jihadi view object here inside of our 116 00:07:19,770 --> 00:07:20,700 screen. 117 00:07:20,790 --> 00:07:24,240 So here inside of this design we can see discrete view here. 118 00:07:24,500 --> 00:07:25,140 OK. 119 00:07:25,410 --> 00:07:29,360 Now let's actually create another class. 120 00:07:29,510 --> 00:07:30,080 OK. 121 00:07:30,330 --> 00:07:34,050 Another adapter that actually extends from the base adapter class. 122 00:07:34,050 --> 00:07:34,630 OK. 123 00:07:34,920 --> 00:07:41,900 So here are actually click on File New dhaba class and for the name of your class just type in here 124 00:07:41,910 --> 00:07:45,570 a great view adapter. 125 00:07:45,890 --> 00:07:46,600 OK. 126 00:07:46,710 --> 00:07:48,200 And then click on OK. 127 00:07:48,630 --> 00:07:56,100 So this is our great view class and this class and it's to actually extends from the base adapter class 128 00:07:56,790 --> 00:07:59,300 if you want to actually use the grid view. 129 00:07:59,350 --> 00:08:03,600 You need to actually extend from this base adapter class here. 130 00:08:03,600 --> 00:08:08,520 So now if I actually opened up a browser here it is actually to debate it after class. 131 00:08:08,520 --> 00:08:14,140 You can actually put in this you are in your web browser and in order to be guided to this page. 132 00:08:14,160 --> 00:08:17,910 So this is the base it after class and this class is actually an abstract class. 133 00:08:17,910 --> 00:08:18,660 OK. 134 00:08:18,750 --> 00:08:25,410 And here as you can see it says common base class of common implementation for an adapter that can be 135 00:08:25,410 --> 00:08:26,970 used in both list view. 136 00:08:27,060 --> 00:08:27,390 OK. 137 00:08:27,390 --> 00:08:31,790 By implementing this specialized it after interface and spinner. 138 00:08:31,830 --> 00:08:32,420 OK. 139 00:08:32,430 --> 00:08:37,620 So as you can see here we've got the if it's the public if it's the constructor here as you can see 140 00:08:38,140 --> 00:08:42,080 and as you can see here we have these inherited constants. 141 00:08:42,210 --> 00:08:42,880 OK. 142 00:08:43,260 --> 00:08:45,110 And here you can see these Misfit's here. 143 00:08:45,210 --> 00:08:49,370 OK so now let's actually go back to our Android studio ID. 144 00:08:49,710 --> 00:08:55,780 And now as you can see it's showing us an error and it says that we need to actually implement this 145 00:08:55,830 --> 00:09:01,020 specific methods because this class is actually extending from the space adapter class. 146 00:09:01,080 --> 00:09:06,680 So we need to actually override the inherited methods that we actually inherit from the space adapter 147 00:09:06,690 --> 00:09:07,530 class. 148 00:09:07,530 --> 00:09:09,170 This is actually an abstract class. 149 00:09:09,240 --> 00:09:17,670 Ok so here let's actually right click and then click on generate and here click on implement misfits. 150 00:09:17,670 --> 00:09:23,700 So as you can see here these are the methods that we need to actually implement in our own class get 151 00:09:23,750 --> 00:09:27,350 Count get item get item ID and get a view. 152 00:09:27,360 --> 00:09:29,030 So just click on OK. 153 00:09:29,700 --> 00:09:34,940 So here we can see that these benefits are actually up over rated here. 154 00:09:35,010 --> 00:09:35,470 OK. 155 00:09:35,580 --> 00:09:39,570 And then let's actually put in some lines of code here and then we've been actually putting our own 156 00:09:39,570 --> 00:09:42,240 implementations inside of these methods. 157 00:09:42,240 --> 00:09:47,430 So now let's actually direct some our images some animal images into our project. 158 00:09:47,460 --> 00:09:51,140 So here in my on my desktop I have images here. 159 00:09:51,150 --> 00:09:56,300 So I just need to select all of these images and then I need to copy these images. 160 00:09:56,460 --> 00:10:04,610 Right click on them and then click on copy items and then here inside my ID I can actually click on 161 00:10:04,610 --> 00:10:07,380 these tribal folder and then right click on it. 162 00:10:07,730 --> 00:10:10,030 And here I can just click on paste. 163 00:10:10,130 --> 00:10:12,870 So here I just need to click on this OK here. 164 00:10:13,010 --> 00:10:18,040 So now as you can see these are the images of our animal animals as you can see here.