1 00:00:00,440 --> 00:00:01,040 ‫Hey, there. 2 00:00:01,280 --> 00:00:07,700 ‫Welcome back, Siobhan, the site now in this lecture, let us discuss about sin in next hour. 3 00:00:07,700 --> 00:00:10,190 ‫We also refer this topic as Xanax. 4 00:00:10,940 --> 00:00:15,980 ‫It's important because this will help you to visualize thing in include Z-axis. 5 00:00:16,550 --> 00:00:20,300 ‫So as you know, there are three axes the x one y axis. 6 00:00:20,570 --> 00:00:25,760 ‫And then when we are visualizing thing in the 3D world, there is a Xanax is. 7 00:00:26,760 --> 00:00:29,940 ‫How we are going to realize this topic and why it is important. 8 00:00:30,780 --> 00:00:38,070 ‫The first thing is I took a section and then added four lives inside that that is first, second, third 9 00:00:38,070 --> 00:00:39,690 ‫and fourth as their last name. 10 00:00:40,110 --> 00:00:47,670 ‫And also gave our weight and height to live as common and then background color to each of the glass. 11 00:00:48,270 --> 00:00:50,010 ‫Simple, no other changes. 12 00:00:50,550 --> 00:00:53,760 ‫So if I get back here, I have my four lives. 13 00:00:54,400 --> 00:01:01,800 ‫Now, if you visualize we are currently working on the y axis because this is a complete block, we 14 00:01:01,800 --> 00:01:04,060 ‫have item one two three four. 15 00:01:04,080 --> 00:01:06,390 ‫So on y axis, we have this sequence. 16 00:01:07,110 --> 00:01:16,740 ‫But suppose I have maybe display as a nine block, see if this one get back. 17 00:01:17,400 --> 00:01:22,200 ‫Now they are arranged in into x axis, so they are one two three four. 18 00:01:22,740 --> 00:01:23,400 ‫That's great. 19 00:01:23,730 --> 00:01:27,510 ‫So we are working well on Y as well as x axis. 20 00:01:28,020 --> 00:01:36,630 ‫But what do I have something overlapping, so suppose I have this position as absolute and I give top 21 00:01:36,630 --> 00:01:43,050 ‫as zero pixels and left as zero pixels to all of them, all their lives. 22 00:01:43,890 --> 00:01:47,130 ‫So that means all my device will be on this same position. 23 00:01:47,460 --> 00:01:54,690 ‫If I get back here, hit all of my div are represented, but they are on the back side, one after the 24 00:01:54,690 --> 00:01:55,710 ‫other, after the other. 25 00:01:56,190 --> 00:01:59,100 ‫If I want to visualize this, suppose I have this. 26 00:01:59,100 --> 00:02:00,690 ‫Do it's orange here? 27 00:02:00,930 --> 00:02:01,860 ‫Then I have the second. 28 00:02:02,340 --> 00:02:03,730 ‫This is also arranged here. 29 00:02:03,990 --> 00:02:05,080 ‫Then I returned them. 30 00:02:05,100 --> 00:02:06,450 ‫This is also arranged here. 31 00:02:06,870 --> 00:02:13,200 ‫Now, if they are of the same size, we are not able to visualize or we are not able to see the last 32 00:02:13,200 --> 00:02:18,660 ‫one, the one which is behind the scene and how I'm going to control this. 33 00:02:18,660 --> 00:02:21,480 ‫Whatever, I want the first one to be on the top. 34 00:02:22,020 --> 00:02:23,010 ‫If I get my head. 35 00:02:24,040 --> 00:02:31,720 ‫You can see this is my day one, which is off, I guess, winter cooler than we have, second of which 36 00:02:31,720 --> 00:02:37,540 ‫is all red and third live pictures of green and then for do, which is often blue. 37 00:02:38,440 --> 00:02:46,150 ‫And if you take here, I'm able to visualize what I'm able to see only the fourth one, which is delayed. 38 00:02:46,150 --> 00:02:47,580 ‫This started or last started. 39 00:02:47,950 --> 00:02:48,580 ‫That means. 40 00:02:50,170 --> 00:02:55,210 ‫First, I will have the first one and then overlapping second one and then overlap. 41 00:02:55,480 --> 00:02:56,620 ‫We have a third one. 42 00:02:56,800 --> 00:02:58,750 ‫And on the dog, we will have 4.1. 43 00:02:58,960 --> 00:03:02,020 ‫So that's how the sequence grows from top to bottom. 44 00:03:02,650 --> 00:03:04,720 ‫And similarly, we have been following this. 45 00:03:05,320 --> 00:03:09,850 ‫So that means we only have the last one as visual point. 46 00:03:10,630 --> 00:03:16,660 ‫In such cases, if by any chance, I want this to be on the top or this one could be on the top. 47 00:03:17,940 --> 00:03:23,050 ‫How I can control this, that's where this Zelin next topic comes to better. 48 00:03:24,220 --> 00:03:27,670 ‫So by default, the Z index value is auto. 49 00:03:28,570 --> 00:03:33,130 ‫That means all of them are auto right now, all the dips are auto. 50 00:03:34,300 --> 00:03:38,440 ‫In terms of in next part, maybe I want some was there zero? 51 00:03:38,470 --> 00:03:40,750 ‫Maybe I want any item to be on the top. 52 00:03:40,770 --> 00:03:43,570 ‫I can give us any next value greater than that. 53 00:03:43,960 --> 00:03:53,200 ‫So suppose if all these Knicks as zero head, if I see their index, maybe one now this red one will 54 00:03:53,200 --> 00:03:53,920 ‫be on the top. 55 00:03:53,950 --> 00:03:57,130 ‫If I get back here, you can see the red one is on the top. 56 00:03:57,970 --> 00:03:58,630 ‫OK, great. 57 00:03:59,650 --> 00:04:03,130 ‫My led to this one and it says zero Knicks. 58 00:04:04,570 --> 00:04:07,610 ‫As to now, this one will be on the top. 59 00:04:07,630 --> 00:04:08,020 ‫Why? 60 00:04:08,230 --> 00:04:14,170 ‫Because the Z Index is greater than the other available overlapping levels may get back in. 61 00:04:14,260 --> 00:04:15,200 ‫You can see this one. 62 00:04:16,060 --> 00:04:20,620 ‫Let's say their index as maybe three here. 63 00:04:20,770 --> 00:04:25,210 ‫If I get back, you can see now I'm able to visualize default one. 64 00:04:25,810 --> 00:04:26,500 ‫So knocked out. 65 00:04:26,500 --> 00:04:33,430 ‫This Z index can help us to manage the overlapping and help us decide which one we want at the top. 66 00:04:33,940 --> 00:04:38,470 ‫Now these three mics are important when we are working with menus, when we are scrolling things. 67 00:04:38,480 --> 00:04:46,780 ‫If you see a scrolling head on camera and this is stable here and the zero next is great because so 68 00:04:46,810 --> 00:04:49,350 ‫all the other items will be on the back of it. 69 00:04:49,730 --> 00:04:56,650 ‫Here you can see this is stable here or if it was a different other websites online, there will be 70 00:04:56,650 --> 00:05:00,270 ‫some icon, there will be menus, there will be buttons. 71 00:05:00,550 --> 00:05:05,080 ‫They're not always on the top and they never go behind because of these sitting next. 72 00:05:05,470 --> 00:05:10,510 ‫And we can take this as zero as negative as it is as positive. 73 00:05:10,930 --> 00:05:14,080 ‫So that means maybe I want this one so I can say zero index. 74 00:05:14,470 --> 00:05:16,510 ‫And let's say I want this to be on the top. 75 00:05:16,750 --> 00:05:21,130 ‫Always something like give a big index value for, let's say, 100. 76 00:05:21,760 --> 00:05:23,560 ‫And if I save this one, get back here. 77 00:05:24,040 --> 00:05:25,270 ‫Now this is going to be top. 78 00:05:25,300 --> 00:05:33,440 ‫Maybe if I try, maybe here six five, then this will always be on the back because this has a value 79 00:05:33,440 --> 00:05:40,330 ‫all hungry for like, we are arranging them in us back and we provide them value. 80 00:05:40,330 --> 00:05:41,680 ‫So they're on this stack. 81 00:05:41,680 --> 00:05:44,290 ‫All I took on a rule. 82 00:05:44,650 --> 00:05:46,900 ‫I gave them the value of one. 83 00:05:47,110 --> 00:05:52,690 ‫Then this is the value two, which is more important than value, then more important value. 84 00:05:52,990 --> 00:05:58,900 ‫And more importantly, and if I give a value of maybe one zero five, this will be more important than 85 00:05:59,320 --> 00:06:01,600 ‫if I give value of one zero six. 86 00:06:01,990 --> 00:06:03,280 ‫This will be more important. 87 00:06:04,150 --> 00:06:07,630 ‫You can see so that's what this is going to help. 88 00:06:08,690 --> 00:06:16,940 ‫So that means if we have multiple lives on same level and we provide them zero in next, we can override 89 00:06:16,940 --> 00:06:21,230 ‫which one do we want, which one we want to see on the top. 90 00:06:21,860 --> 00:06:23,180 ‫I hope you got the idea. 91 00:06:23,450 --> 00:06:25,970 ‫So they in control the Z-axis. 92 00:06:26,840 --> 00:06:32,540 ‫Now what if we have another section, maybe a new section, and this section has a new do? 93 00:06:32,990 --> 00:06:34,700 ‫Let me qualify as first. 94 00:06:39,150 --> 00:06:43,620 ‫That the first and the background color. 95 00:06:45,990 --> 00:06:48,120 ‫Background color blue. 96 00:06:48,450 --> 00:06:51,630 ‫OK, now we haven't provided any of that index. 97 00:06:52,730 --> 00:06:54,560 ‫What will happen, this is fiction. 98 00:06:54,800 --> 00:06:55,700 ‫This is fiction. 99 00:06:57,260 --> 00:07:02,330 ‫Should this come on the top, this fourth one or this fifth one? 100 00:07:03,230 --> 00:07:03,950 ‫Get back here. 101 00:07:04,610 --> 00:07:06,590 ‫Well, you can see the fourth one. 102 00:07:06,620 --> 00:07:07,070 ‫Why? 103 00:07:07,400 --> 00:07:12,370 ‫Because at this point of time, the value of this set in next is auto. 104 00:07:13,160 --> 00:07:20,810 ‫But if I provide news at index value here, let's say one zero seven, save this one. 105 00:07:21,710 --> 00:07:25,010 ‫Now you can visualize the fifth one. 106 00:07:25,880 --> 00:07:28,820 ‫So that's how things are going to work with Z index value. 107 00:07:29,240 --> 00:07:30,920 ‫By default, they are auto. 108 00:07:31,880 --> 00:07:33,590 ‫I hope you are the best idea. 109 00:07:35,570 --> 00:07:41,180 ‫Now, remember one thing, if by any chance we haven't provided any type of data in Nicaragua to any 110 00:07:41,180 --> 00:07:50,510 ‫item, then the last item which is appearing here, last item in our top-to-bottom will control the 111 00:07:50,510 --> 00:07:51,280 ‫overlapping. 112 00:07:51,350 --> 00:07:54,020 ‫So this is going to be on the visual side. 113 00:07:54,140 --> 00:07:58,970 ‫If I get back here, you can see you can check out this fifth one, which is the blue one. 114 00:08:00,040 --> 00:08:01,510 ‫So that's how this is going to work. 115 00:08:01,850 --> 00:08:04,150 ‫A good example is from Minogue's. 116 00:08:04,480 --> 00:08:05,680 ‫If I scroll down here. 117 00:08:06,340 --> 00:08:07,690 ‫So here we are controlling. 118 00:08:07,690 --> 00:08:12,400 ‫These are the index value of this yellow box and the other ones are already arranged. 119 00:08:12,970 --> 00:08:15,160 ‫So this yellow box is auto. 120 00:08:15,370 --> 00:08:16,990 ‫So that's why it's behind. 121 00:08:17,260 --> 00:08:22,960 ‫Then we added some new item, all of them on auto, but they are in sequence of the new item will be 122 00:08:22,960 --> 00:08:23,470 ‫on the door. 123 00:08:24,010 --> 00:08:27,310 ‫Then we have on that item there next to only talk. 124 00:08:27,310 --> 00:08:29,170 ‫We have sitting next for on the dock. 125 00:08:29,170 --> 00:08:30,370 ‫We have their next six. 126 00:08:31,000 --> 00:08:35,650 ‫But if I change, the item does index value for yellow box, let's say one. 127 00:08:36,340 --> 00:08:38,140 ‫Then you can see as soon as you provide. 128 00:08:38,170 --> 00:08:41,290 ‫And is there any next value all the auto will be on behind? 129 00:08:41,680 --> 00:08:44,530 ‫So that the next one will be greater than the auto one? 130 00:08:45,070 --> 00:08:45,760 ‫OK, great. 131 00:08:46,180 --> 00:08:49,760 ‫If I say, is there the next three, it will overlap. 132 00:08:49,780 --> 00:08:55,840 ‫The second one, if I say five or lap default one segment or lap this one. 133 00:08:56,290 --> 00:08:58,410 ‫So that's how we can control. 134 00:08:58,420 --> 00:08:59,650 ‫Is there an index value? 135 00:09:00,040 --> 00:09:03,610 ‫And this is important when we have multiple dips on this same position. 136 00:09:04,150 --> 00:09:08,530 ‫At this point of time, I am providing zero pixel to all of them. 137 00:09:08,770 --> 00:09:14,320 ‫But let's see different values let the top as zero zero. 138 00:09:14,770 --> 00:09:23,380 ‫And let me be going to then maybe 50 can't be. 139 00:09:30,370 --> 00:09:31,450 ‫40 50. 140 00:09:38,020 --> 00:09:38,880 ‫50 50. 141 00:09:39,160 --> 00:09:40,030 ‫Save this one. 142 00:09:40,450 --> 00:09:41,290 ‫Get back here. 143 00:09:42,320 --> 00:09:47,600 ‫Now you can see they are puzzled up and they are somehow managed because then this is all square than 144 00:09:47,600 --> 00:09:48,590 ‫this one, this one. 145 00:09:48,950 --> 00:09:56,030 ‫So all of them are puzzled somewhere here and there, let's say 100 to 200. 146 00:09:56,330 --> 00:09:56,810 ‫So see. 147 00:09:59,000 --> 00:10:00,170 ‫That's all they are outraged. 148 00:10:00,620 --> 00:10:04,070 ‫Now what I can do is I can select which one I want to watch at the top. 149 00:10:04,070 --> 00:10:06,740 ‫If I want this pink one, I can go ahead. 150 00:10:07,190 --> 00:10:12,410 ‫Oh, this pink one and let two zero in next as one. 151 00:10:14,130 --> 00:10:22,740 ‫This will be on top because the other one on auto say, I want this first one, this bob boilen on the 152 00:10:22,740 --> 00:10:26,460 ‫top so I can see that the Z Index. 153 00:10:26,850 --> 00:10:32,490 ‫Now if I see one, this will not work because from top to bottom, this is going to get ratings. 154 00:10:32,610 --> 00:10:37,310 ‫So if I say one, nothing is going to work because the pink one is going to get debated. 155 00:10:37,980 --> 00:10:42,080 ‫But if I see two, this is going to get pretty fancy. 156 00:10:42,330 --> 00:10:43,590 ‫That's how it is going to work. 157 00:10:44,490 --> 00:10:47,700 ‫So I hope you got the idea how this set in Nixon is going to work. 158 00:10:48,950 --> 00:10:54,500 ‫We will discuss about this more when we start utilizing this concept and project, so you will have 159 00:10:54,500 --> 00:10:55,850 ‫a much clearer idea. 160 00:10:56,510 --> 00:10:58,100 ‫I hope this lecture was helpful. 161 00:10:58,130 --> 00:11:01,220 ‫Make sure to read about it through Minogue's. 162 00:11:01,300 --> 00:11:03,590 ‫And this is going to work really well for you. 163 00:11:04,310 --> 00:11:05,340 ‫Thank you for calling. 164 00:11:05,370 --> 00:11:07,310 ‫And I see you guys in the next one.