1 00:00:07,220 --> 00:00:08,090 Now we have. 2 00:00:09,390 --> 00:00:12,700 Explode the bombs and the elements. 3 00:00:12,990 --> 00:00:14,910 Let's explore the wind. 4 00:00:15,950 --> 00:00:21,050 I'll start by importing by Sempill GeoEye. 5 00:00:22,110 --> 00:00:33,300 As a story, I will create layout, this will be an empty list of less, then I will create a window 6 00:00:33,720 --> 00:00:36,120 which will equal to its Gedo. 7 00:00:37,010 --> 00:00:48,260 Window, the window will have a title and it will need to have Alere, otherwise it will return. 8 00:00:48,260 --> 00:00:50,170 An error must occur. 9 00:00:51,050 --> 00:00:55,060 Until now, no, nothing had appeared on the screen. 10 00:00:56,300 --> 00:01:04,070 To display the window, you will have to read or finalized, we will use the read. 11 00:01:04,830 --> 00:01:13,810 For convention, we are reading events and venues and we will use window that every. 12 00:01:14,740 --> 00:01:23,170 This is still running, as you can see, that tree in here, and this is the window that we have created 13 00:01:24,220 --> 00:01:25,490 what we can do now. 14 00:01:26,020 --> 00:01:31,410 The only thing we can do is to press close, which will close the window. 15 00:01:32,340 --> 00:01:39,900 And then we can use in here when the doctor close all of this are convention. 16 00:01:40,750 --> 00:01:46,000 By conventional, I mean that we are normally using these variable names. 17 00:01:47,000 --> 00:01:49,790 And after the. 18 00:01:51,080 --> 00:01:55,490 Window is closed, we use window dot closed. 19 00:01:56,190 --> 00:01:56,540 OK. 20 00:01:57,880 --> 00:02:04,450 We can give the win to ISIS, for example, I can give it parameters size. 21 00:02:05,660 --> 00:02:09,590 And again, I'll give you two hundred and 200. 22 00:02:10,660 --> 00:02:13,960 And let's see this, and it had. 23 00:02:15,450 --> 00:02:24,900 This the wind I have executed, this cell, which is window is closed, but when the is still running, 24 00:02:25,500 --> 00:02:31,470 it's expecting us to have an event by event. 25 00:02:31,470 --> 00:02:35,640 We I mean that an element value had changed. 26 00:02:35,970 --> 00:02:42,960 A button is like a close window is like this is an event. 27 00:02:44,050 --> 00:02:47,230 OK, so when I use. 28 00:02:48,190 --> 00:02:58,150 Went to the thieved, it will be waiting for the window to have an event happening, but I can use a 29 00:02:58,150 --> 00:03:03,330 timeout, for example, five millisecond and let's try this. 30 00:03:04,120 --> 00:03:06,430 The window had appeared. 31 00:03:07,230 --> 00:03:17,790 And it's not waiting for me here when I execute this, it will directly close the window so the execution 32 00:03:17,790 --> 00:03:21,690 is not waiting for me in the window. 33 00:03:22,140 --> 00:03:28,930 By using this timeout, we will see why this is important later. 34 00:03:29,790 --> 00:03:35,300 Now let's explore what are the types of winds? 35 00:03:35,850 --> 00:03:40,230 We have two types of windows that we can use. 36 00:03:41,140 --> 00:03:45,700 The first one is called One Shot. 37 00:03:46,690 --> 00:03:59,440 Window, which is similar to what I mean is a window is displayed when we create an event, the window 38 00:03:59,470 --> 00:04:00,190 will be closed. 39 00:04:00,850 --> 00:04:03,750 When we create an event, the window will be closed. 40 00:04:04,090 --> 00:04:06,460 So let's copy this. 41 00:04:08,950 --> 00:04:10,980 Now let's create a layout. 42 00:04:11,470 --> 00:04:17,500 I will create a text box to use and there something. 43 00:04:18,130 --> 00:04:20,740 Then I will create an input. 44 00:04:21,100 --> 00:04:30,600 And then our two button that we have been using all along will gain and is general counsel. 45 00:04:31,330 --> 00:04:33,520 Hey, now I see this. 46 00:04:33,520 --> 00:04:39,280 I remove the size parameter from here and I remove the time out. 47 00:04:39,880 --> 00:04:45,020 OK, now let's execute this when the read is executed. 48 00:04:45,040 --> 00:04:49,830 The window is displayed and it's waiting for an event. 49 00:04:50,200 --> 00:04:58,930 Perhaps if I type something new, let's for example, say that nothing will happen and we will see this 50 00:04:59,320 --> 00:05:02,250 later, that we can modify this behavior. 51 00:05:02,800 --> 00:05:08,680 But right now the window is waiting for us to press one of these buttons. 52 00:05:08,950 --> 00:05:12,910 OK, cancel or close, I'll be OK. 53 00:05:13,210 --> 00:05:18,790 And then the execution stop so I can execute. 54 00:05:18,790 --> 00:05:21,610 The windows closed and the window is closed. 55 00:05:22,150 --> 00:05:30,640 We can print the event and values, as we have seen previously, saying that we have it saying that 56 00:05:30,640 --> 00:05:33,030 we have to click the like button. 57 00:05:33,040 --> 00:05:44,220 This is the event and the value of input zero is that this is what we have type in the input box. 58 00:05:44,560 --> 00:05:51,490 OK, we can also change this behavior directly here. 59 00:05:51,850 --> 00:05:59,110 When we read the window, we can give it parameter close equals to. 60 00:06:00,080 --> 00:06:06,620 And this will close the window as soon as an event happens. 61 00:06:06,760 --> 00:06:16,610 OK, when I click on OK, an event had happened which is OK, and their values is populated with whatever 62 00:06:16,610 --> 00:06:18,260 type in the box. 63 00:06:18,710 --> 00:06:27,920 OK, so I don't have to use windows to close and I can pass it as a parameter in the method. 64 00:06:28,070 --> 00:06:30,050 This is the one shot window. 65 00:06:30,380 --> 00:06:36,520 Now let's check the other type of windows, which is a persistent window. 66 00:06:36,770 --> 00:06:45,530 Let's copy these rules and I'll paste the minute I remove this and let's modify this code to be a persistent 67 00:06:45,620 --> 00:06:51,730 wind resistant window means that it will not exist unless I tell it to X. 68 00:06:52,160 --> 00:06:56,810 To do this, I'll use while true, this will create an infinite loop. 69 00:06:57,030 --> 00:07:09,080 Then we will check if event equals cancel or event equals s g dot when closed. 70 00:07:09,290 --> 00:07:14,360 And this is the close button for the window, we will break out of this loop. 71 00:07:14,780 --> 00:07:23,380 Otherwise we will print event and values and then we will use window dot crews. 72 00:07:23,810 --> 00:07:27,950 OK, so we have created an infinite loop using. 73 00:07:27,950 --> 00:07:38,720 While true I will rip the window inside this loop if we click on up, if we click on cancer or we press 74 00:07:38,720 --> 00:07:45,860 the close button, we will break out of the loop but we will not close the window and we will print 75 00:07:46,010 --> 00:07:48,040 the event and values inside the loop. 76 00:07:48,320 --> 00:07:57,200 And when we exit out of the loop, we will close the window and print the event and then let's skip 77 00:07:57,200 --> 00:07:57,560 this. 78 00:07:57,980 --> 00:08:07,460 OK, now if I click cancel, I have to exclude the other cell to close the window and plan events and 79 00:08:07,460 --> 00:08:10,610 ways to then cancel. 80 00:08:10,910 --> 00:08:20,870 And the input value is empty, as you can see, since we haven't give a key value to the input box by 81 00:08:20,870 --> 00:08:31,430 simple Joy is giving it a number and it starts by the first element and give it a name zero and then 82 00:08:31,700 --> 00:08:36,410 it continues until it finishes all the elements. 83 00:08:36,680 --> 00:08:45,310 OK, so let's run this again and we will check out what I'll put a value here. 84 00:08:45,710 --> 00:08:46,360 I'll play. 85 00:08:46,570 --> 00:08:50,860 Hey, now, the window is not exiting, OK? 86 00:08:51,230 --> 00:09:00,860 It will not exit out the loop until I click cancel as we have seen previously or I like this close but 87 00:09:01,070 --> 00:09:06,380 ok, when I click the close button, it did not print the event. 88 00:09:06,410 --> 00:09:12,680 We closed, it went numb and ok because I have closed down. 89 00:09:13,160 --> 00:09:22,360 Now let's give a key to this input and change the behavior a little. 90 00:09:22,700 --> 00:09:29,720 To give a key to this input, I will pass the parameter T for convention. 91 00:09:30,110 --> 00:09:37,820 Also, I will name this element as in between two hive, OK. 92 00:09:38,330 --> 00:09:45,070 And also I'll cut these and put them in it after the loop to execute this. 93 00:09:45,110 --> 00:09:47,420 Well, now let's do this. 94 00:09:47,750 --> 00:09:58,070 As you can see, instead of typing zero like this, it's printing the key that we have assigned to the 95 00:09:58,070 --> 00:09:58,460 input. 96 00:09:58,850 --> 00:10:01,160 OK, and this is much better. 97 00:10:01,550 --> 00:10:10,610 But before we leave this, I want to I will remove this key because I want to show you another thing. 98 00:10:11,210 --> 00:10:19,070 I will just create another input and the third one and let's exclude this one, two and three. 99 00:10:19,490 --> 00:10:28,430 I click OK now by simple UI, if we did not assign a key for the input element, it will give it an 100 00:10:28,430 --> 00:10:30,950 index starting with deal. 101 00:10:31,190 --> 00:10:37,990 It will name the element as zero one two and starting from the first element the last. 102 00:10:38,180 --> 00:10:49,250 OK, but to avoid this I prefer to give it a so I remove these and I will give it a key as we have done. 103 00:10:49,550 --> 00:10:50,420 OK, great. 104 00:10:50,750 --> 00:10:53,780 So this is the persistent wind. 105 00:10:54,020 --> 00:10:57,200 OK, so how can we modify? 106 00:10:57,410 --> 00:10:59,210 How can we modify. 107 00:10:59,350 --> 00:11:07,540 Values in this went, for example, let's create a layout, I will just be another textbooks and I will 108 00:11:07,540 --> 00:11:10,580 give it a key and let's skip. 109 00:11:10,750 --> 00:11:12,480 We have forgot to add the comma. 110 00:11:12,880 --> 00:11:14,190 Let's skip this. 111 00:11:14,380 --> 00:11:16,470 This is the first Xbox. 112 00:11:16,540 --> 00:11:17,830 This is the input. 113 00:11:18,010 --> 00:11:20,050 This is the second Xbox. 114 00:11:20,050 --> 00:11:22,210 But there is nothing written in there. 115 00:11:22,330 --> 00:11:31,900 And this is our last list or rule, which is about what I want is I want to type something in here and 116 00:11:32,020 --> 00:11:35,240 I want this text box to be updated with this. 117 00:11:35,770 --> 00:11:36,940 So how can we do this? 118 00:11:37,060 --> 00:11:38,580 I'll close the window. 119 00:11:38,980 --> 00:11:45,350 I want to update whatever in the end, and I want to put it in Dalkey. 120 00:11:45,610 --> 00:11:49,510 To do this, we will use Window O out. 121 00:11:49,690 --> 00:11:58,060 As you can see, the values doesn't contain the outcome, OK, because this is a textbook, but the 122 00:11:58,060 --> 00:12:00,460 window contains Daokui. 123 00:12:00,460 --> 00:12:08,750 So we will use window of out of date method and I'll get the values of in it. 124 00:12:08,800 --> 00:12:18,640 Now let's you this day when I click OK and populated the second text box is with the values from the 125 00:12:18,640 --> 00:12:25,960 input box, but the size by default of the Xbox is one. 126 00:12:25,960 --> 00:12:26,340 Correct. 127 00:12:26,350 --> 00:12:34,510 So let's cancel, let's give this size and I'll give it twenty by one for example. 128 00:12:34,720 --> 00:12:39,220 Now let's do this again and it has updated that. 129 00:12:39,580 --> 00:12:47,050 OK, but I have to click and event every time to update this Xbox. 130 00:12:47,070 --> 00:12:50,890 OK, but we can modify this a bit more. 131 00:12:51,130 --> 00:12:53,530 OK, let's close the window. 132 00:12:53,830 --> 00:12:55,630 Let's copy this layout. 133 00:12:55,810 --> 00:13:00,690 And there is a property that is called enable event. 134 00:13:00,970 --> 00:13:09,520 If I said that the true it will fire an event whenever the input or the text box value is change. 135 00:13:09,730 --> 00:13:13,050 So let's give this a try and execute this. 136 00:13:13,060 --> 00:13:18,220 And now each character high time it will fire anyone. 137 00:13:18,370 --> 00:13:19,510 OK, of course. 138 00:13:19,540 --> 00:13:24,130 Also when I click on OK, it will fire an event. 139 00:13:24,340 --> 00:13:27,100 So I want only to update this. 140 00:13:27,280 --> 00:13:39,010 For example, if the event was coming from the input box, OK, but if the event equals this should 141 00:13:39,010 --> 00:13:45,340 be equal for equality equals OK, this means that I have to click the button. 142 00:13:45,580 --> 00:13:47,790 I will display Ubobo. 143 00:13:47,860 --> 00:13:49,650 You click OK. 144 00:13:49,810 --> 00:13:57,040 Now let's this when I add a value in here, it had fire an event. 145 00:13:57,490 --> 00:14:07,030 The event is called in because we have enable the event in the input box because we have set the initial 146 00:14:07,120 --> 00:14:09,760 event equal to in the input box. 147 00:14:09,960 --> 00:14:14,650 OK, but when I click a key it will display above. 148 00:14:14,870 --> 00:14:21,550 OK, now this will allow us to modify the elements in the persistent wind. 149 00:14:21,730 --> 00:14:33,130 OK, we can also customize the look of the window by using seems there is a thin list which will display 150 00:14:33,130 --> 00:14:36,460 all the colours that we can use. 151 00:14:36,800 --> 00:14:50,260 OK, so let's copy and paste this and try different themes to customize the same values as the theme. 152 00:14:50,470 --> 00:14:54,640 And I have to give it one of these. 153 00:14:55,240 --> 00:14:58,060 Or for example, let's try this one. 154 00:14:58,720 --> 00:15:01,660 I'll give Da Blue 17. 155 00:15:02,510 --> 00:15:12,350 I can pass it just like this, and it had changed the color of the window, or I can give it like this 156 00:15:12,350 --> 00:15:14,500 dark blue 70. 157 00:15:14,780 --> 00:15:16,280 Let's try this one. 158 00:15:16,690 --> 00:15:18,860 OK, so I can pass it either way. 159 00:15:19,160 --> 00:15:30,330 But I can also if I want to use the default, I can use the default Windows or Mac OS or Linux theme. 160 00:15:30,530 --> 00:15:35,680 Let's display this and this is the default, which is great. 161 00:15:35,810 --> 00:15:45,680 And the author of the package is giving us a message that this is a boring gray so you can customize 162 00:15:45,680 --> 00:15:48,080 the color as you want. 163 00:15:48,780 --> 00:15:51,830 OK, for example, let's check the till. 164 00:15:52,010 --> 00:15:58,280 But of course this is depends on how you like to render irrelevant. 165 00:15:58,610 --> 00:16:05,750 But normally the users are familiar with the default lock. 166 00:16:05,930 --> 00:16:13,220 The window has also taken some parameters, like the title. 167 00:16:14,990 --> 00:16:24,080 I come the size and this is similar to what we have seen in the Daboub, OK, this will conclude our 168 00:16:24,140 --> 00:16:25,490 window lecture. 169 00:16:26,060 --> 00:16:28,960 Thank you for watching and join me in the next lecture.