1 00:00:00,150 --> 00:00:05,850 Hi everyone in this theater all we're going to go ahead and create another Android application. 2 00:00:05,850 --> 00:00:06,950 So just click on this. 3 00:00:06,990 --> 00:00:14,970 Start in your Android studio project and for the application name just typing here at 47 and then click 4 00:00:14,970 --> 00:00:20,740 on Next choose API 16 Android 4.1 Lee-Payne for the minimum SDK. 5 00:00:20,880 --> 00:00:22,330 Click on next here. 6 00:00:22,350 --> 00:00:25,520 Choose our Blancher activity next. 7 00:00:25,800 --> 00:00:27,410 Here click on finish. 8 00:00:27,720 --> 00:00:33,370 So now let's actually select this hello world text view and then present it here on your keyboard. 9 00:00:33,640 --> 00:00:35,470 And now it's actually double click on this. 10 00:00:35,470 --> 00:00:42,150 And as for their layout activity underline made that example here choose this faluting action button 11 00:00:42,180 --> 00:00:45,480 and then and then a person delete key on your keyboard. 12 00:00:45,480 --> 00:00:48,980 So let's actually go back and say this content underline made that example. 13 00:00:48,990 --> 00:00:52,900 And now we want to actually designed the user interface of our application. 14 00:00:53,040 --> 00:00:57,970 But first of all let me actually to show you a demo of the application that you want to create in this 15 00:00:58,080 --> 00:00:59,150 to your Tauriel. 16 00:00:59,220 --> 00:01:04,170 So as you can see here this is our application that we want to create in the Seattle area. 17 00:01:04,320 --> 00:01:08,780 And as you can see here it says these are our animal images in the gallery. 18 00:01:08,790 --> 00:01:10,660 So we have it takes few here. 19 00:01:10,890 --> 00:01:13,190 And this is these are the images. 20 00:01:13,200 --> 00:01:18,480 So if you have a gallery so we want to use a gallery in our application and here I can actually scroll 21 00:01:18,480 --> 00:01:22,780 to the left in order to see the other animals here. 22 00:01:22,920 --> 00:01:29,480 As you can see so and as you can see if I scroll to the right I can see the other animals here. 23 00:01:29,820 --> 00:01:30,990 OK. 24 00:01:31,170 --> 00:01:38,140 Now if I scroll down a little bit here you can see it says these are all animal images in a scroll view. 25 00:01:38,160 --> 00:01:38,440 OK. 26 00:01:38,460 --> 00:01:40,160 A horizontal scroll view. 27 00:01:40,170 --> 00:01:46,740 So here I have an horizontal scroll you here as you can see if I actually scroll live to the left or 28 00:01:46,740 --> 00:01:50,070 scroll to the right I can see these images. 29 00:01:50,160 --> 00:01:51,250 OK. 30 00:01:51,540 --> 00:01:57,420 And if I actually click on these for example image I can see that specific image at the bottom. 31 00:01:57,480 --> 00:01:58,090 OK. 32 00:01:58,230 --> 00:02:04,090 So here if I actually click on this fish here I can see this image and I can see this tossed here. 33 00:02:04,110 --> 00:02:11,100 So if you actually click on this for example this horse I can see this horse here and I can see it is 34 00:02:11,100 --> 00:02:11,710 toast. 35 00:02:11,820 --> 00:02:12,580 OK. 36 00:02:12,900 --> 00:02:16,460 So let's actually create this application. 37 00:02:16,620 --> 00:02:17,130 OK. 38 00:02:17,310 --> 00:02:23,970 So first of all we need to actually write our linearly out vertical at the center of this relatively 39 00:02:23,990 --> 00:02:24,570 out here. 40 00:02:24,570 --> 00:02:31,260 So now let's actually track our scroll view of vertical scroll view into this linearly outwards vertical. 41 00:02:31,320 --> 00:02:31,840 OK. 42 00:02:32,010 --> 00:02:37,620 So here inside of these containers fall there you have these vertical scroll wheel here. 43 00:02:37,620 --> 00:02:42,130 So just select it and put it at the center of this linearly I swear to god. 44 00:02:42,150 --> 00:02:42,740 OK. 45 00:02:43,020 --> 00:02:44,510 So I just need to put it here. 46 00:02:44,970 --> 00:02:51,120 And now let's actually try to linearly vertical into these vertical scroll view. 47 00:02:51,150 --> 00:02:55,330 So as you know scroll you can only accept one direct choice. 48 00:02:55,380 --> 00:03:02,460 OK so I can just practice linearly out of article here and then I can't just put it in situs scroll 49 00:03:02,460 --> 00:03:03,040 you here. 50 00:03:03,090 --> 00:03:03,810 OK. 51 00:03:04,140 --> 00:03:10,890 And then I can actually put in my computer my user interface components inside this linearly out call 52 00:03:10,890 --> 00:03:11,260 here. 53 00:03:11,280 --> 00:03:11,900 OK. 54 00:03:12,000 --> 00:03:17,630 So first of all I need to actually put in a large takes you into These are linearly and vertical. 55 00:03:17,690 --> 00:03:18,550 OK. 56 00:03:18,600 --> 00:03:23,910 So for the lay out our gravity as you can see we can actually choose the center. 57 00:03:23,910 --> 00:03:26,760 So just a selectees attribute here. 58 00:03:27,180 --> 00:03:30,070 And then selectees horizontal. 59 00:03:30,540 --> 00:03:34,740 OK so now let's actually double click on these text view. 60 00:03:34,980 --> 00:03:42,930 And for the text just type in here these are our animal images inside a gallery and then a person enter 61 00:03:42,930 --> 00:03:44,600 key on your keyboard. 62 00:03:44,610 --> 00:03:50,350 So now let's actually find that gravity attributes of these tapes view here. 63 00:03:50,400 --> 00:03:54,180 As you can see here we have this gravity as tribute here. 64 00:03:54,180 --> 00:03:59,590 So just open this gravity attribute and then our checked is our center horizontal checkbox here. 65 00:03:59,760 --> 00:04:04,060 So as we can see now the taste of this state's view is at the center of these thing. 66 00:04:04,110 --> 00:04:04,610 OK. 67 00:04:04,890 --> 00:04:11,160 So now let's actually track a gallery into this linearly out vertical. 68 00:04:11,220 --> 00:04:17,110 So as you can see here inside these containers folder if you have this gallery here OK so just select 69 00:04:17,110 --> 00:04:21,860 it and put it inside these are linearly out vertical here. 70 00:04:22,230 --> 00:04:23,970 OK so we have this gallery here. 71 00:04:24,000 --> 00:04:30,980 So now I want this gallery to be at the center of this linearly out vertical OK so we have this Delury 72 00:04:30,990 --> 00:04:35,340 and it is at the left hand side of this are linearly out vertical. 73 00:04:35,460 --> 00:04:38,070 So I can just select this linearly elsewhere the. 74 00:04:38,250 --> 00:04:42,710 And as you can see we have these gravity attributes for these linearly outward ticket. 75 00:04:42,750 --> 00:04:49,250 So just check these Center underline horizontal checkbox here that is related to this gravity. 76 00:04:49,800 --> 00:04:51,680 And if you actually click on this get it here. 77 00:04:51,690 --> 00:04:56,470 Now as you can see this gallery is at the center of this linearly outward ticket. 78 00:04:56,480 --> 00:04:56,820 OK. 79 00:04:56,850 --> 00:05:02,190 Let's actually drag and either takes few into this linearly it's vertical. 80 00:05:02,190 --> 00:05:07,970 So just select this large takes stakes here and put it inside these linearly alphabetical here. 81 00:05:08,040 --> 00:05:08,520 OK. 82 00:05:08,640 --> 00:05:10,060 So this is our taste. 83 00:05:10,350 --> 00:05:11,350 Double click on it. 84 00:05:11,460 --> 00:05:12,300 OK. 85 00:05:12,500 --> 00:05:18,830 And for the ticks just typing here these are our animal images inside the horizontal scroll view. 86 00:05:18,960 --> 00:05:19,470 OK. 87 00:05:19,590 --> 00:05:22,450 And then present Enter key on your keyboard. 88 00:05:22,780 --> 00:05:23,360 OK. 89 00:05:23,670 --> 00:05:28,620 So now let's actually our select this takes you and then find the gravity attributes as you can see 90 00:05:28,620 --> 00:05:29,600 here. 91 00:05:29,790 --> 00:05:31,610 We have this gravity attribute here. 92 00:05:31,620 --> 00:05:32,230 OK. 93 00:05:32,280 --> 00:05:36,020 And then it is set center underline horizontal checkbox here. 94 00:05:36,030 --> 00:05:42,120 So as you can see here now are the text of the state's view is actually at the center of the state's 95 00:05:42,120 --> 00:05:42,360 view. 96 00:05:42,360 --> 00:05:49,060 OK so now let's actually track a horizontal scroll view into this linearly outwards the call. 97 00:05:49,200 --> 00:05:55,170 So here inside this container this fall there as you can see we have our horizontal scroll view here 98 00:05:55,200 --> 00:05:55,940 as you can see. 99 00:05:56,040 --> 00:06:00,770 So just select it and put it inside this linearly out vertical here. 100 00:06:00,930 --> 00:06:01,450 OK. 101 00:06:01,680 --> 00:06:03,790 So this is our horizontal scroll view. 102 00:06:04,140 --> 00:06:11,400 And then let's actually track a linearly out horizontal as you can see we have a linearly or horizontal 103 00:06:11,400 --> 00:06:11,820 here. 104 00:06:11,970 --> 00:06:16,220 So just select it and put it inside these horizontal scroll view here. 105 00:06:16,380 --> 00:06:17,310 OK. 106 00:06:17,750 --> 00:06:23,640 And now let's actually select this linearly and horizontal here as you can see that is inside of these 107 00:06:23,910 --> 00:06:25,220 horizontal scroll view. 108 00:06:25,350 --> 00:06:26,040 OK. 109 00:06:26,100 --> 00:06:35,090 And let's actually find the ID attribute and the ID just type in here linear lay layout horizontal. 110 00:06:35,820 --> 00:06:36,590 OK. 111 00:06:36,720 --> 00:06:43,850 Now we want to actually assign an ID to these are lay out linearly with horizontal. 112 00:06:44,060 --> 00:06:44,750 OK. 113 00:06:45,000 --> 00:06:50,580 Now let's actually drag an image view into this linearly out vertical here. 114 00:06:50,580 --> 00:06:51,130 OK. 115 00:06:51,150 --> 00:06:56,430 So it's just selectees image for you here and put it inside these linearly out vertical. 116 00:06:56,520 --> 00:06:56,930 OK. 117 00:06:56,940 --> 00:07:01,560 Now let's actually select this image view here and actually find the idea. 118 00:07:01,590 --> 00:07:02,720 The idea attributes. 119 00:07:02,820 --> 00:07:08,080 So this is the id attribute and the ID just type in here and G animal. 120 00:07:08,740 --> 00:07:09,080 OK. 121 00:07:09,090 --> 00:07:11,660 And then press on Enter key on your keyboard. 122 00:07:11,700 --> 00:07:12,390 OK. 123 00:07:12,630 --> 00:07:15,370 So here are actually to select the state's view. 124 00:07:15,420 --> 00:07:20,280 And now I want to actually change some of the attributes of the state's view for example or you want 125 00:07:20,280 --> 00:07:22,460 to increase the size of this text view. 126 00:07:22,530 --> 00:07:25,920 So I need to actually find the text size attribute. 127 00:07:25,920 --> 00:07:28,490 So for the size just assign the value of 50. 128 00:07:28,700 --> 00:07:29,370 OK. 129 00:07:29,610 --> 00:07:39,210 And for the color you can actually assign a color for example hash tag 0 0 F F 0 0 and then press enter 130 00:07:39,210 --> 00:07:40,340 key on your keyboard. 131 00:07:40,500 --> 00:07:41,640 OK. 132 00:07:41,750 --> 00:07:48,040 And let's actually to select this text view here and now let's actually find the text size attributes 133 00:07:48,090 --> 00:07:55,140 as you can see this is the thing that the text size attribute and for the size of the text view I can't 134 00:07:55,140 --> 00:07:56,830 just assign the value of 50. 135 00:07:57,220 --> 00:08:03,660 And now for the color of the states you can just put in a hash tag here and I can't just type in F F 136 00:08:04,440 --> 00:08:10,230 for example of 4 4 and 0 0 and then press Enter key on your keyboard. 137 00:08:10,230 --> 00:08:17,020 And now as you can see the carload of these takes few is actually changed to another color. 138 00:08:17,240 --> 00:08:25,830 OK so now let's actually go back inside the main activity of a fight here and now let's actually select 139 00:08:26,100 --> 00:08:31,230 these lines of code that are related to the Options menu and then actually the selectees block of code 140 00:08:31,420 --> 00:08:34,230 that is actually related to the floating action button. 141 00:08:34,230 --> 00:08:40,810 Ok so if we don't need this block of code here OK and then press on into the delete key on your keyboard. 142 00:08:40,980 --> 00:08:45,680 And now let's actually put in some more lines of code here. 143 00:08:45,740 --> 00:08:46,110 OK. 144 00:08:46,110 --> 00:08:51,900 So first of all let's actually declare an object of type Gallerie here in the state of our class. 145 00:08:52,020 --> 00:08:53,880 So here I can just type in Gelati. 146 00:08:54,060 --> 00:08:54,560 OK. 147 00:08:54,780 --> 00:09:00,370 So by the way let me point out that the gallery is actually deprecated. 148 00:09:00,530 --> 00:09:00,800 OK. 149 00:09:00,790 --> 00:09:02,460 In Android 4.1. 150 00:09:02,460 --> 00:09:02,980 OK. 151 00:09:03,150 --> 00:09:04,310 And as you can see here. 152 00:09:04,500 --> 00:09:07,980 But I think it is still useful and we can use it. 153 00:09:08,040 --> 00:09:09,070 OK in other applications. 154 00:09:09,090 --> 00:09:09,560 OK. 155 00:09:09,780 --> 00:09:16,490 So you may actually face other applications that are actually using the using gallery. 156 00:09:16,500 --> 00:09:20,110 OK so you may want to know how to use this gallery. 157 00:09:20,240 --> 00:09:24,710 Actually we did ok how to use this component in your applications. 158 00:09:24,720 --> 00:09:25,440 OK. 159 00:09:25,500 --> 00:09:29,040 So let's actually go back and say this main activity that I will fight and as you can see that there 160 00:09:29,040 --> 00:09:33,550 is a crust on this gallery here and that means that this gallery is actually deprecated. 161 00:09:33,570 --> 00:09:34,260 OK. 162 00:09:34,650 --> 00:09:39,030 We can actually use a horizontal scroll view or other components. 163 00:09:39,030 --> 00:09:39,570 OK. 164 00:09:39,780 --> 00:09:42,630 So but for this application I want to use gallery. 165 00:09:42,680 --> 00:09:43,340 OK. 166 00:09:43,380 --> 00:09:46,010 So here I referred to the name of this gelati class. 167 00:09:46,200 --> 00:09:46,760 OK. 168 00:09:46,890 --> 00:09:49,770 And that the name of this gallery is Gallery. 169 00:09:50,130 --> 00:09:51,730 And inside is uncreate Smurfette. 170 00:09:51,750 --> 00:09:54,750 I can actually instantiate this gallery object. 171 00:09:54,750 --> 00:09:57,540 So I just referred to the name of this object gallery. 172 00:09:57,600 --> 00:10:02,180 Assignment operator and then I need to actually cast this object to a gallery object. 173 00:10:02,400 --> 00:10:02,870 OK. 174 00:10:03,030 --> 00:10:07,990 Find view by ID are that Id dot ANGELETTI. 175 00:10:08,070 --> 00:10:08,640 OK. 176 00:10:08,880 --> 00:10:15,780 So as you can see here inside this content underline minute example the idea of this actually that the 177 00:10:15,780 --> 00:10:21,330 idea of this gallery is actually let's actually find the idea attributes here as you can see the idea 178 00:10:21,330 --> 00:10:22,650 of this gallery East Gallery. 179 00:10:22,650 --> 00:10:23,090 OK.