1 00:00:04,290 --> 00:00:15,830 Now let's create a canvas, so let's lay out the layout is a list of list, the first rule will be listed 2 00:00:15,990 --> 00:00:16,870 on canvas. 3 00:00:17,490 --> 00:00:23,090 I'll give it a size, which is a couple of hundred and hundred. 4 00:00:23,100 --> 00:00:30,750 For example, I can give a background color, which will be blue, for example, and I will give it 5 00:00:30,750 --> 00:00:39,530 something called EKI will explore the key later when we exclude the windows. 6 00:00:39,900 --> 00:00:43,400 But key is like a variable name. 7 00:00:43,410 --> 00:00:51,340 I am assigning it for the element so I can grab its value later. 8 00:00:52,110 --> 00:00:55,460 We'll explore this in great detail later. 9 00:00:56,040 --> 00:01:05,820 I'll call it canvas, for example, and I will create another list which correspond to another room. 10 00:01:06,390 --> 00:01:07,470 This will have to. 11 00:01:07,980 --> 00:01:11,440 OK, and let's see the council. 12 00:01:11,780 --> 00:01:12,340 OK. 13 00:01:13,140 --> 00:01:17,880 And again, I will copy these two cells. 14 00:01:18,060 --> 00:01:19,470 I'll paint them here. 15 00:01:19,500 --> 00:01:30,220 But this time I will do another thing to be able to draw on the canvas before reading the window. 16 00:01:30,960 --> 00:01:34,530 I'll have to use a method called finalize. 17 00:01:35,570 --> 00:01:42,190 Finalized will allow us to make changes prior using the. 18 00:01:45,040 --> 00:01:55,480 I'll ask you this, and this had created the window, then I will create a variable canvas which will 19 00:01:55,480 --> 00:02:00,910 equal to Windu of canvas to get the element. 20 00:02:01,540 --> 00:02:05,330 We will use the element key as we have defined it years. 21 00:02:05,620 --> 00:02:10,050 And the Windu object is like a dictionary. 22 00:02:10,450 --> 00:02:17,800 I can just pass in the key and it will give me a handle to this element. 23 00:02:18,130 --> 00:02:22,910 OK, now let's draw a circle, for example. 24 00:02:23,380 --> 00:02:26,100 So I will create a circle. 25 00:02:26,110 --> 00:02:42,610 This will be canvas dot t t canvas dot create lövin and I'll give it 50 50 and under a hundred and now 26 00:02:42,640 --> 00:02:50,660 we can read the window and it had created Darvel inside the camps. 27 00:02:51,430 --> 00:02:54,970 OK, now let's create checkbox. 28 00:02:55,450 --> 00:03:01,870 I will create a layout which will again will equal to as jadot checkbox. 29 00:03:02,050 --> 00:03:04,630 I will give a name checkbox. 30 00:03:05,080 --> 00:03:07,510 I will also create another room. 31 00:03:07,780 --> 00:03:21,060 This one will be dot c box and I will create another row as the CB and I will create two buttons as 32 00:03:21,380 --> 00:03:35,310 the key is the council and we will copy both our windows to create the window and display Dalitz. 33 00:03:35,320 --> 00:03:46,990 Execute this and this and this have created three checkboxes checkbox is equivalent to C box is equivalent 34 00:03:46,990 --> 00:03:48,400 to c.B. 35 00:03:48,670 --> 00:03:54,420 I can select all of them or I can remove the selection. 36 00:03:54,580 --> 00:03:58,800 Clicking on a checkbox will make it picked. 37 00:03:58,990 --> 00:04:06,340 By the way, if I did not add Dalkey and cancel buttons then to close the window, the only option we 38 00:04:06,340 --> 00:04:14,350 have is to click that close, but which will not return anything. 39 00:04:14,690 --> 00:04:21,640 OK, so to rerun and display the window, we will have to create to recreate the layout. 40 00:04:22,120 --> 00:04:30,610 From the beginning I just click execute cell and now if I click ok, it will display. 41 00:04:31,030 --> 00:04:43,030 The event is we have no key button and since none of them has to use by simple view, I will assign 42 00:04:43,030 --> 00:04:44,540 them numbers. 43 00:04:45,040 --> 00:04:51,430 So first element is assigned to zero second one, third two. 44 00:04:51,910 --> 00:04:57,480 We can use them like this or the preferred method is to assign them key. 45 00:04:58,120 --> 00:05:06,730 So I say this one is checkbox, but there is also a convention for the keys. 46 00:05:07,210 --> 00:05:15,910 Of course you can use whatever you want, but the convention is to use hyphen then capital letters, 47 00:05:16,300 --> 00:05:17,740 the name that you want to assign. 48 00:05:18,250 --> 00:05:23,080 Check one, for example, or check one, then hyphen. 49 00:05:23,930 --> 00:05:32,030 And then this one will have the hyphen check two and this one will give it a key. 50 00:05:32,660 --> 00:05:35,250 Let's not give a key to this one. 51 00:05:35,270 --> 00:05:40,280 Now, let's you I'll check the first one and the last one. 52 00:05:40,760 --> 00:05:42,290 Now let's click on OK. 53 00:05:42,650 --> 00:05:50,370 And the key for the first one is equal to the key for the second one, equal to false. 54 00:05:50,750 --> 00:05:54,140 The third one, because it does not have a key. 55 00:05:54,960 --> 00:06:01,720 By simple are assigned a number and send the first two elements heftiest. 56 00:06:02,010 --> 00:06:05,130 So it started with zero. 57 00:06:05,430 --> 00:06:14,160 So to remove the confusion, you can just give it a key or you will know that if the element doesn't 58 00:06:14,160 --> 00:06:20,460 have a key, then by simple joy will assign it a number, starting with zero. 59 00:06:20,580 --> 00:06:30,660 And again, one is if we click on cancel, the event will be printed, which is canceled and all the 60 00:06:30,660 --> 00:06:32,100 values of the key. 61 00:06:32,280 --> 00:06:40,110 OK, so if the keys have a values and we click cancel, they are display as well. 62 00:06:40,350 --> 00:06:45,030 OK, now let's check what is a column later. 63 00:06:46,020 --> 00:06:50,830 Let's create the columns and we will see how this will. 64 00:06:51,270 --> 00:06:54,760 So I'll copy this and modify it. 65 00:06:55,260 --> 00:06:59,820 I'll give this name column one and I remove the buttons. 66 00:07:00,090 --> 00:07:02,770 So now this is a list of less. 67 00:07:02,790 --> 00:07:04,440 Again, nothing changed. 68 00:07:04,590 --> 00:07:13,230 I'll copy the cell and pasted in here and I rename this column to I'll give this check one URL, which 69 00:07:13,230 --> 00:07:17,670 means left out and this will be our this will be our. 70 00:07:17,940 --> 00:07:20,070 OK, now let's rename this. 71 00:07:20,940 --> 00:07:23,780 Again, this is the name of the check. 72 00:07:23,790 --> 00:07:29,490 I am just giving them L and ah so you can know which one. 73 00:07:30,480 --> 00:07:34,320 OK, now let's again copy these three. 74 00:07:34,590 --> 00:07:38,790 I will remove this and create a column. 75 00:07:38,940 --> 00:07:43,980 This column will contain column one and I create another column. 76 00:07:44,160 --> 00:07:52,140 I can use column or cool which are both the same thing and I will give this to current. 77 00:07:52,860 --> 00:07:54,330 Now let's exclude this. 78 00:07:54,580 --> 00:07:55,770 Hey, hey. 79 00:07:55,950 --> 00:07:59,140 We have forgot to place a comma in here. 80 00:07:59,280 --> 00:08:06,630 So now when you see this pattern method, you will have to rerun it again. 81 00:08:06,870 --> 00:08:13,430 OK, because we have executed this cell without the comma, then executed again. 82 00:08:13,800 --> 00:08:17,660 So it had considered that this layout had been used. 83 00:08:17,910 --> 00:08:21,700 So you cannot use a used up anyway. 84 00:08:21,930 --> 00:08:28,610 Now we have created our window with three checkboxes on the left and three checkboxes on the right. 85 00:08:28,890 --> 00:08:30,870 And this is called accordingly. 86 00:08:31,290 --> 00:08:39,480 This is a column and this is a column because the does not have to be the same thing as we will see 87 00:08:39,720 --> 00:08:40,220 later. 88 00:08:40,230 --> 00:08:43,910 But now we have created two columns layout. 89 00:08:43,920 --> 00:08:46,320 We can have multiple different columns. 90 00:08:46,860 --> 00:08:51,140 OK, I will choose this, this and this. 91 00:08:51,150 --> 00:08:56,340 For example, let's click on and check what is written. 92 00:08:57,250 --> 00:08:59,980 The event that is returning is OK. 93 00:09:00,340 --> 00:09:01,510 Check one, two. 94 00:09:01,790 --> 00:09:06,960 That's why the naming or giving the element key is very important. 95 00:09:07,510 --> 00:09:12,010 All the check boxes that we have to have to. 96 00:09:13,110 --> 00:09:26,460 Otherwise, they have false we can also use a vertical separator, which we can put it near as the vertical 97 00:09:26,940 --> 00:09:37,490 separator lets it scale this again and this is the vertical separate it just for separating these elements. 98 00:09:37,530 --> 00:09:39,690 It's to divide the interface. 99 00:09:40,080 --> 00:09:42,940 Now, let's check the camera box. 100 00:09:42,960 --> 00:09:45,660 I will create some values. 101 00:09:45,930 --> 00:09:51,770 I'll create less of A, B, C, D, E, F, G, for example. 102 00:09:52,140 --> 00:09:54,180 And this will create a less. 103 00:09:54,540 --> 00:09:57,210 Let's find the values. 104 00:09:57,650 --> 00:10:03,660 OK, now let's copy and paste this in instead of typing them. 105 00:10:04,320 --> 00:10:11,280 I just remove all of this and I will create a combo box to create a combo box. 106 00:10:11,280 --> 00:10:17,850 Values as g dot com boom is complete takes values. 107 00:10:18,730 --> 00:10:26,950 Which is unless we will use the list that we have created and I can give it a default value or not. 108 00:10:27,250 --> 00:10:33,820 So let's first check this and see how to and execute this. 109 00:10:34,450 --> 00:10:35,740 And it had great. 110 00:10:36,550 --> 00:10:45,820 A combo box did not assign anything in here, and I think the size is a bit small, so let's modify 111 00:10:45,820 --> 00:10:46,090 this. 112 00:10:46,330 --> 00:10:57,090 I gave it size equal to five and let's say for now, let's exclude this again. 113 00:10:57,370 --> 00:11:06,040 And now it have we should have created another name for the values because the values overwritten by 114 00:11:06,040 --> 00:11:07,020 the values in it. 115 00:11:07,160 --> 00:11:09,030 OK, I'll cancel this. 116 00:11:09,700 --> 00:11:13,450 I'll give this a name of data, for example. 117 00:11:13,900 --> 00:11:15,490 Data and date. 118 00:11:16,150 --> 00:11:17,380 Let's do this. 119 00:11:17,880 --> 00:11:27,630 OK, now we have this is five characters wide and four characters long, which is the size. 120 00:11:27,640 --> 00:11:31,770 And here again, the combo box doesn't have a default value. 121 00:11:32,170 --> 00:11:39,820 We can give it a default value in here by using default value parameters. 122 00:11:40,360 --> 00:11:44,380 And I'll assign a date of zero, for example. 123 00:11:45,490 --> 00:11:48,970 So let's do this again and now. 124 00:11:50,000 --> 00:12:01,070 Has a default value, if I click OK, it will return this, I have click, OK, and the value is a month 125 00:12:01,070 --> 00:12:03,520 before it will be empty. 126 00:12:03,540 --> 00:12:03,890 Let's. 127 00:12:04,780 --> 00:12:08,710 They this and execute the same cell again. 128 00:12:08,730 --> 00:12:10,180 Now, if I clicked, okay. 129 00:12:11,170 --> 00:12:14,230 It's he and an empty string. 130 00:12:14,720 --> 00:12:15,050 OK.