1 00:00:00,280 --> 00:00:06,290 Hire everyone in this theater all we're going to go ahead and create another other Android application. 2 00:00:06,300 --> 00:00:12,420 So just click on this start in your Android studio project here for the name of our application just 3 00:00:12,420 --> 00:00:20,610 type in your app 40 and then click on next and here choose API 16 Android 4.1 jelly for the minimum 4 00:00:20,630 --> 00:00:25,550 SDK and then click on next and here choose Blancher activity next. 5 00:00:25,590 --> 00:00:27,700 And then here click on finish. 6 00:00:28,050 --> 00:00:30,740 And here Sallet is hell over textfield. 7 00:00:30,990 --> 00:00:37,020 And then press sun delete key on your keyboard and then actually double click and this is folder layout 8 00:00:37,320 --> 00:00:43,110 activity underline minute segment and here selectees floating action button and then press on delete 9 00:00:43,110 --> 00:00:44,520 key on your keyboard. 10 00:00:44,520 --> 00:00:47,920 So let's actually go back and say this content underline minute example. 11 00:00:48,030 --> 00:00:52,290 And here we want to actually design the user interface of our application. 12 00:00:52,290 --> 00:00:58,440 First of all let me show you a demo of the application that we want to actually create in this tutorial. 13 00:00:58,470 --> 00:01:03,300 So as you can see here this is the application that we want to actually create in this tutorial and 14 00:01:03,300 --> 00:01:07,250 here as you can see I have a text view as you can see here. 15 00:01:07,380 --> 00:01:10,340 This is actually takes you inside a text switcher. 16 00:01:10,350 --> 00:01:10,860 OK. 17 00:01:10,890 --> 00:01:15,290 So we want to actually learn how to use text switcher in Android. 18 00:01:15,300 --> 00:01:15,760 OK. 19 00:01:15,960 --> 00:01:20,780 So as you can see here we have actually a previous button here and a next button. 20 00:01:20,810 --> 00:01:26,310 So essentially click on this next button here and now as you can see the value of this takes you actually 21 00:01:26,310 --> 00:01:28,320 changed to another value. 22 00:01:28,530 --> 00:01:30,550 And if you actually click on the previous button. 23 00:01:30,750 --> 00:01:33,000 Now this is the previous value OK. 24 00:01:33,060 --> 00:01:34,950 So here you can see the other value. 25 00:01:34,950 --> 00:01:36,020 OK. 26 00:01:36,280 --> 00:01:43,410 But another important point about this text feature is that the text can only accept two string values. 27 00:01:43,410 --> 00:01:50,910 Ok so here we need to actually create a string array of two string values only two values and we can 28 00:01:50,920 --> 00:01:54,980 actually switch between these two values by clicking on these buttons. 29 00:01:54,990 --> 00:01:55,710 OK. 30 00:01:55,770 --> 00:01:58,370 And as you can see we have an animation effects here. 31 00:01:58,440 --> 00:01:59,040 OK. 32 00:01:59,340 --> 00:02:01,970 So this is how we can actually use text suture. 33 00:02:02,040 --> 00:02:10,140 And here you can see that we have another value and here you can see that I can change those values 34 00:02:10,140 --> 00:02:11,000 here. 35 00:02:11,520 --> 00:02:12,370 OK. 36 00:02:12,690 --> 00:02:19,490 So first of all we need to actually putting our linearly out vertical at the center of this relatively 37 00:02:19,490 --> 00:02:20,340 out here. 38 00:02:20,700 --> 00:02:26,820 And then we need to actually drag a vertical scroll view into this linearly alphabetical. 39 00:02:26,970 --> 00:02:34,510 So as you can see here we have this vertical scroll view selected and put it at the center of this linearly 40 00:02:34,510 --> 00:02:35,130 outward ticket. 41 00:02:35,140 --> 00:02:35,720 OK. 42 00:02:36,880 --> 00:02:42,730 And as you can see here you have a layout with attributes and height attributes for this scroll. 43 00:02:42,730 --> 00:02:43,150 OK. 44 00:02:43,210 --> 00:02:50,470 So just select this layout with attributes of this scroll view this article scroll view and assign the 45 00:02:50,470 --> 00:02:51,730 value wrap content. 46 00:02:51,740 --> 00:02:53,280 So just click on this button here. 47 00:02:53,360 --> 00:02:58,810 The raw content and again for the layout height assign the value or add content. 48 00:02:59,470 --> 00:03:00,270 OK. 49 00:03:00,640 --> 00:03:06,640 And here as you can see if you have a look as gravity and as you can see this is for the center as you 50 00:03:06,640 --> 00:03:08,950 can see if you have center horizontal OK. 51 00:03:09,040 --> 00:03:10,210 This is really important. 52 00:03:10,450 --> 00:03:13,800 And if we actually didn't assign this holds onto it. 53 00:03:13,810 --> 00:03:15,900 And we actually assigned this on set here. 54 00:03:16,030 --> 00:03:20,880 Now as you can see this scroll is at the top left hand corner of the screen. 55 00:03:20,940 --> 00:03:24,850 OK but we want this scroll to be at the center of this linearly. 56 00:03:24,850 --> 00:03:25,600 I swear to god. 57 00:03:25,630 --> 00:03:30,880 So here I just need to select a center attribute here and assign this horizontal here. 58 00:03:31,000 --> 00:03:38,000 OK so now let's actually drag a linearly vertical into this vertical scroll. 59 00:03:38,000 --> 00:03:42,030 You'll remember that scroll you can only accept one direct choice. 60 00:03:42,220 --> 00:03:48,100 So here we need to dredge up linearly out vertical into this scroll view here and now we can actually 61 00:03:48,100 --> 00:03:54,450 put all the user interface components into this linearly out vertical. 62 00:03:54,460 --> 00:03:59,260 But here as you can see I made a mistake and I actually write a linearly out horizontal. 63 00:03:59,320 --> 00:04:02,160 So here I can actually correct this error. 64 00:04:02,230 --> 00:04:08,280 This mistake here but as you can see if you have an orientation attribute here for this linearly out 65 00:04:08,280 --> 00:04:08,500 here. 66 00:04:08,500 --> 00:04:09,000 OK. 67 00:04:09,010 --> 00:04:14,040 So here I can actually select this orientation and I can change it to vertical. 68 00:04:14,200 --> 00:04:18,450 And now the orientation of this linearly is vertical. 69 00:04:18,480 --> 00:04:19,080 OK. 70 00:04:19,300 --> 00:04:24,920 So by just selecting this Orient orientation attributes of this linearly out you can actually select 71 00:04:24,940 --> 00:04:29,210 whether you want to use a horizontal scroll view or a vertical scroll. 72 00:04:29,230 --> 00:04:29,890 OK. 73 00:04:30,310 --> 00:04:32,090 So hopefully that makes sense. 74 00:04:32,110 --> 00:04:37,670 And now let's actually try it takes the suture into this linearly elsewhere. 75 00:04:37,680 --> 00:04:38,110 OK. 76 00:04:38,170 --> 00:04:43,510 So as you can see here inside this expert folder here I have this it takes through each component. 77 00:04:43,510 --> 00:04:43,960 OK. 78 00:04:43,960 --> 00:04:48,500 So just select it and put it inside these linearly where to call. 79 00:04:48,630 --> 00:04:55,760 OK so here we have this text suture component and for the I think the idea would be takes through each 80 00:04:55,900 --> 00:04:56,340 one. 81 00:04:56,340 --> 00:04:57,510 I think this is better. 82 00:04:57,550 --> 00:04:59,060 Takes two to one. 83 00:04:59,810 --> 00:05:05,620 And now let's actually direct our linearly out horizontal into this linearly alphabetical here. 84 00:05:05,740 --> 00:05:06,100 OK. 85 00:05:06,130 --> 00:05:07,010 Just put it here. 86 00:05:07,300 --> 00:05:12,880 And now let's actually try to image buttons into this linearly and horizontal. 87 00:05:12,880 --> 00:05:17,010 So here inside these widgets folder I have this image button component. 88 00:05:17,050 --> 00:05:23,800 So just try it and put it inside these linearly and horizontal and actually direct another image button 89 00:05:24,160 --> 00:05:27,180 into this linearly out horizontal here. 90 00:05:27,420 --> 00:05:28,030 OK. 91 00:05:28,330 --> 00:05:30,870 So now as you can see. 92 00:05:31,210 --> 00:05:35,310 Now I want to actually track some images into my project. 93 00:05:35,350 --> 00:05:35,920 OK. 94 00:05:36,010 --> 00:05:40,220 So here I just need to select this adorable folder. 95 00:05:40,350 --> 00:05:40,820 OK. 96 00:05:40,930 --> 00:05:44,080 And I have this image just in my on my desktop. 97 00:05:44,080 --> 00:05:44,530 OK. 98 00:05:44,590 --> 00:05:47,880 So I just need to select it and right click on them. 99 00:05:48,010 --> 00:05:54,010 And then here I just need to copy two items here and then here I just need to select this drivable folder 100 00:05:54,310 --> 00:05:56,650 and then paste these two items here. 101 00:05:56,680 --> 00:05:56,950 OK. 102 00:05:56,950 --> 00:05:57,880 And then here click on. 103 00:05:57,880 --> 00:05:58,690 OK. 104 00:05:58,870 --> 00:06:01,880 So here you can see these images in say distractible folder. 105 00:06:02,080 --> 00:06:02,470 OK. 106 00:06:02,560 --> 00:06:05,120 So here just select this image button here. 107 00:06:05,320 --> 00:06:05,790 OK. 108 00:06:05,830 --> 00:06:09,230 Now I want to actually assign an ID to this image button. 109 00:06:09,250 --> 00:06:12,880 So here I just need to find the attributes of this image button. 110 00:06:12,880 --> 00:06:15,270 So here this is the idea attributes. 111 00:06:15,400 --> 00:06:25,950 And here I can just typing PTEN next between three one OK. 112 00:06:26,600 --> 00:06:32,750 And for this image button as you can see selected and for the idea of this image but then just assign 113 00:06:32,750 --> 00:06:37,880 the value between next one. 114 00:06:38,030 --> 00:06:38,860 OK. 115 00:06:39,110 --> 00:06:46,490 And now I want to actually give an image to this image but it's so so so just select these PTEN prevent 116 00:06:46,820 --> 00:06:48,070 image what's in here. 117 00:06:48,260 --> 00:06:51,360 And now let's actually find the RC attribute here. 118 00:06:51,410 --> 00:06:57,710 As you can see we have this attribute you select it and click on this button here as you can see and 119 00:06:57,800 --> 00:07:00,060 select the project folder here. 120 00:07:00,260 --> 00:07:03,170 And now let's actually close this color folder. 121 00:07:03,350 --> 00:07:08,360 And now I can actually search for my image name inside the tribal folder. 122 00:07:08,510 --> 00:07:12,190 So as you can see here we have this next image button. 123 00:07:12,230 --> 00:07:14,820 And we have this next image. 124 00:07:14,850 --> 00:07:16,510 And this previous image here. 125 00:07:16,520 --> 00:07:16,960 OK. 126 00:07:17,120 --> 00:07:21,020 So here I need to actually select a previous image OK. 127 00:07:21,260 --> 00:07:23,540 And then click on OK. 128 00:07:23,890 --> 00:07:24,430 OK. 129 00:07:24,470 --> 00:07:30,310 So as you can see here I need to actually assign a value for the left feet and a value for the length 130 00:07:30,320 --> 00:07:32,370 height of this image. 131 00:07:32,410 --> 00:07:38,240 OK so as you can see at the moment the layout of this image but it is set up content so just are selected 132 00:07:38,570 --> 00:07:39,980 and assign a value. 133 00:07:39,980 --> 00:07:47,160 For example number 100 for the delta V and a value for the they are height 100. 134 00:07:47,450 --> 00:07:54,930 OK so now as you can see I have these values that I actually assigned for the left and height. 135 00:07:54,960 --> 00:08:00,640 OK so now let's actually select this linearly out horizontal that you can see here. 136 00:08:00,680 --> 00:08:01,400 OK. 137 00:08:01,460 --> 00:08:06,410 And then as you can see we have this layout with attributes and this layout height attributes for this 138 00:08:06,410 --> 00:08:07,960 linearly and horizontal. 139 00:08:08,000 --> 00:08:15,050 So just select is a layout as you can see here are attributes for this linearly or horizontal and then 140 00:08:15,110 --> 00:08:22,670 assigned a value wrapped content to these attributes and then select display height attribute and then 141 00:08:22,670 --> 00:08:24,620 assign the value wrap content. 142 00:08:25,010 --> 00:08:25,720 OK. 143 00:08:25,940 --> 00:08:30,720 And now it's actually the select is between pre-vote image button here as you can see. 144 00:08:30,940 --> 00:08:34,690 And now it's actually find this cave type attribute here. 145 00:08:34,700 --> 00:08:40,070 So this is this Katib attributes inside these properties section as you can see and then assigned a 146 00:08:40,070 --> 00:08:41,910 value feet's x y. 147 00:08:42,100 --> 00:08:42,300 OK. 148 00:08:42,320 --> 00:08:46,580 Now as you can see our image is actually fit inside this image button. 149 00:08:46,670 --> 00:08:47,500 OK. 150 00:08:47,790 --> 00:08:51,680 And now let's actually select is Pythian next one here as you can see. 151 00:08:51,770 --> 00:08:54,100 And there's actually assigned a value for the live feed. 152 00:08:54,110 --> 00:08:58,520 For example number a hundred and a value for that height. 153 00:08:58,930 --> 00:08:59,670 OK. 154 00:08:59,810 --> 00:09:03,910 And here let's actually find DSR the attributes. 155 00:09:04,100 --> 00:09:06,430 As you can see here we have these attributes here. 156 00:09:06,440 --> 00:09:09,860 Select it and click on this button here. 157 00:09:10,000 --> 00:09:12,360 I to select this project tap close. 158 00:09:12,400 --> 00:09:14,100 These are colorful here. 159 00:09:14,120 --> 00:09:18,870 Now I can actually search for my image name for example next. 160 00:09:18,950 --> 00:09:22,810 And as you can see here this is my image name and I just need to click on. 161 00:09:22,810 --> 00:09:25,430 OK so this is our image. 162 00:09:25,430 --> 00:09:28,260 And here I need to find the actual escape type. 163 00:09:28,340 --> 00:09:28,800 OK. 164 00:09:28,910 --> 00:09:32,670 Selected and assigned a value feet's x y. 165 00:09:32,720 --> 00:09:37,210 Now as you can see our images actually fit inside this image. 166 00:09:37,220 --> 00:09:37,790 But it OK.