0 1 00:00:04,260 --> 00:00:06,190 Hello again. In previous what we did, 1 2 00:00:06,190 --> 00:00:10,040 let me run our application. We created our search box 2 3 00:00:10,040 --> 00:00:12,357 and also list box, right? What I want to do now in this lesson 3 4 00:00:12,357 --> 00:00:16,780 I want to create this widgets, sorry this Search-Box 4 5 00:00:16,780 --> 00:00:20,100 and also List-Box widgets OK. Here what I need to do, 5 6 00:00:20,100 --> 00:00:22,853 here I will come and search bar is here, right? 6 7 00:00:24,508 --> 00:00:26,782 Also I will create a label for search bar and I will say 7 8 00:00:26,782 --> 00:00:28,032 self-dot-lbl 8 9 00:00:30,441 --> 00:00:31,274 lbl 9 10 00:00:33,570 --> 00:00:35,470 search OK. 10 11 00:00:35,470 --> 00:00:39,070 Search is equal to, here I will use of course, 11 12 00:00:39,070 --> 00:00:41,780 label constructor method and the first parameter 12 13 00:00:42,770 --> 00:00:44,460 will be our, its master right? 13 14 00:00:44,460 --> 00:00:46,810 Its master is search bar, right? 14 15 00:00:46,810 --> 00:00:49,993 and after that text is going to be search 15 16 00:00:56,480 --> 00:01:00,230 and here what I want to do, also I want use font property, 16 17 00:01:00,230 --> 00:01:02,663 font is equal to Arial, 17 18 00:01:06,250 --> 00:01:10,960 12 and bold. And other one is bg, background colour. 18 19 00:01:10,960 --> 00:01:12,893 So for background colour I will say, 19 20 00:01:15,465 --> 00:01:16,465 9bc9ff OK. 20 21 00:01:21,700 --> 00:01:23,507 And also what I want to do 21 22 00:01:23,507 --> 00:01:28,507 I want to use here font color, fg is equal to simply white. 22 23 00:01:29,410 --> 00:01:32,833 OK and now is fine, what I want to do. 23 24 00:01:34,880 --> 00:01:38,170 We created our text, right? For text I want to use 24 25 00:01:38,170 --> 00:01:41,560 grid geometry "self.lbl_search.grid" OK. 25 26 00:01:47,640 --> 00:01:50,150 First variable will row, right? 26 27 00:01:50,150 --> 00:01:55,150 Row is going to be zero and column is of course is zero again 27 28 00:01:56,240 --> 00:01:59,990 and also I want to use padx and also pady. 28 29 00:01:59,990 --> 00:02:04,990 For padx, 20 and for pady, I will say 10 OK. 29 30 00:02:06,520 --> 00:02:10,793 And let's create our entry. Before that let's run our application, 30 31 00:02:12,780 --> 00:02:17,010 so all search text is here, I want to create an entry here 31 32 00:02:17,010 --> 00:02:22,010 and next thing is a button OK. So how can I do that? 32 33 00:02:22,010 --> 00:02:27,010 Here, I will say self-dot. By the way we don't need to 33 34 00:02:27,210 --> 00:02:31,110 use self for these because they are static widgets right? 34 35 00:02:31,110 --> 00:02:34,730 But I am going to use OK, if you don't want to use self 35 36 00:02:34,730 --> 00:02:36,960 for guys because they are static, you don't have to use 36 37 00:02:36,960 --> 00:02:40,863 self, OK self parameter. And I will say, entry search 37 38 00:02:43,743 --> 00:02:47,980 Search is equal to entry constructor method and 38 39 00:02:47,980 --> 00:02:51,450 here parent will be search bar 39 40 00:02:51,450 --> 00:02:55,290 and width is going to be thirty 40 41 00:02:55,290 --> 00:02:58,933 and border, I want this border for guy. 41 42 00:02:58,933 --> 00:03:01,071 OK and border is equal to ten. 42 43 00:03:01,071 --> 00:03:03,233 And after that here what I will say, 43 44 00:03:03,233 --> 00:03:06,316 I will say "self.ent_search.grid" OK. 44 45 00:03:08,751 --> 00:03:13,168 For grid, I'll say row is equal to zero but this time 45 46 00:03:14,383 --> 00:03:18,133 column is going to be one OK. And also I want 46 47 00:03:19,582 --> 00:03:22,165 use column span for this guy columnspan is going to be 3 47 48 00:03:25,702 --> 00:03:29,785 And after that "padx=10" and "pady=10". 48 49 00:03:33,450 --> 00:03:35,943 OK. If I run my application now, 49 50 00:03:39,880 --> 00:03:44,073 Something wrong. Width, I always do this mistake width. 50 51 00:03:48,813 --> 00:03:50,260 And now is fine 51 52 00:03:52,914 --> 00:03:55,994 and our search entry is here, 52 53 00:03:55,994 --> 00:03:57,343 so what I need to do now, I need to use here a button, 53 54 00:03:58,840 --> 00:04:01,823 right button will be here on the right side. 54 55 00:04:02,950 --> 00:04:05,163 To do that what I need to do, here I will come and create 55 56 00:04:05,163 --> 00:04:10,163 a variable "self.btn_search"=Button constructor method 56 57 00:04:14,319 --> 00:04:19,152 and search bar is parent and after that text is going to be 57 58 00:04:22,482 --> 00:04:24,399 let's say search simply 58 59 00:04:26,913 --> 00:04:31,080 and font, font is equal to Arial, and let's say 12 59 60 00:04:35,034 --> 00:04:38,784 and I am going to use bold. Bg is going to be 60 61 00:04:45,757 --> 00:04:50,757 fcc324 and also for font colour, fg is equal to simply white. 61 62 00:04:55,386 --> 00:04:57,936 And now what I need to do, I need to use geometry manager 62 63 00:04:59,283 --> 00:05:01,116 "self.btn_search.grid" 63 64 00:05:06,330 --> 00:05:11,055 and row of course is going to be zero but column is 64 65 00:05:11,055 --> 00:05:14,831 will be four. Why is four? Because here we already 65 66 00:05:14,831 --> 00:05:18,857 used columnspan for this guy and it is three OK. 66 67 00:05:18,857 --> 00:05:23,328 That's why we will see column four. And here I will use 67 68 00:05:23,328 --> 00:05:28,328 padx is going to be 20 and pady is ten. 68 69 00:05:30,874 --> 00:05:34,460 Now we can, we are ready to run our application. 69 70 00:05:34,460 --> 00:05:36,860 Everything is here and looks fine. 70 71 00:05:36,860 --> 00:05:40,130 We can also write something and search is working. 71 72 00:05:40,130 --> 00:05:43,960 OK good. So what I need to do, now I want to create here 72 73 00:05:43,960 --> 00:05:48,960 my List-box widget, right? List is for my widget, 73 74 00:05:50,290 --> 00:05:53,980 widgets for list bar, list box or anyway. 74 75 00:05:53,980 --> 00:05:57,570 And here what I need to do. I need to create another lbl, 75 76 00:05:57,570 --> 00:06:00,810 and I will not use self this time, "lbl_list=label" 76 77 00:06:04,330 --> 00:06:09,330 and parent is list bar and text is going to be 77 78 00:06:11,600 --> 00:06:16,600 short by, 78 79 00:06:17,200 --> 00:06:21,640 short by, and the font is going to be, 79 80 00:06:21,640 --> 00:06:25,813 this time let's use Times, 16 and bold OK. 80 81 00:06:26,680 --> 00:06:31,047 And fg is going to be here 2488ff OK. 81 82 00:06:36,320 --> 00:06:40,617 And also background, "bg='#fcc324'" OK. 82 83 00:06:49,120 --> 00:06:52,450 And what I need to do now, I need to use geometry measure 83 84 00:06:52,450 --> 00:06:54,330 lbl list dot grid again 84 85 00:06:58,330 --> 00:07:03,230 and row is zero and column, column is, 85 86 00:07:07,060 --> 00:07:09,520 I want to use two. Why is two? Let me explain 86 87 00:07:09,520 --> 00:07:13,040 because if I run my application now, I want to locate 87 88 00:07:13,040 --> 00:07:16,750 this guy here OK. In the middle of my frame. 88 89 00:07:16,750 --> 00:07:18,840 Now is not like that because I do get other widgets. 89 90 00:07:18,840 --> 00:07:22,374 OK and if I create other widgets I move it somewhere here, 90 91 00:07:22,374 --> 00:07:24,776 OK here in the middle of my frame. 91 92 00:07:24,776 --> 00:07:28,610 That's why I said column not zero, column two. 92 93 00:07:28,610 --> 00:07:31,700 And after that here what I need to say, I need to create 93 94 00:07:31,700 --> 00:07:34,470 my radio buttons, right? Three radio buttons, 94 95 00:07:34,470 --> 00:07:39,470 radio button one is equal to radio button constructor 95 96 00:07:39,740 --> 00:07:44,450 method and here I'll say list bar is parent and text 96 97 00:07:44,450 --> 00:07:49,450 is going to be all books before first one 97 98 00:07:49,518 --> 00:07:53,373 and other one is other property is our variable and I will say, 98 99 00:07:54,272 --> 00:07:59,272 "var=self.listChoice" OK. We didn't create this one, 99 100 00:08:03,290 --> 00:08:06,340 I will. Let me copy this variable name, 100 101 00:08:10,067 --> 00:08:15,067 and now, also I want to give value for this guy 101 102 00:08:15,800 --> 00:08:20,033 and it will be one, "value=1", and also bg, 102 103 00:08:23,916 --> 00:08:28,183 background is going to be fcc324 OK. 103 104 00:08:29,260 --> 00:08:32,310 And now what I need to do, if I want to use radio buttons 104 105 00:08:32,310 --> 00:08:35,212 and to use integer variable, right? 105 106 00:08:35,212 --> 00:08:39,403 So here I will say "self.listChoice=IntVar" OK. 106 107 00:08:41,860 --> 00:08:45,040 And for this guy, for first one. 107 108 00:08:45,040 --> 00:08:47,252 For second one I will press control + D and 108 109 00:08:47,252 --> 00:08:50,074 for third one control +D. So what I need to do now, 109 110 00:08:50,074 --> 00:08:54,250 this one will be two and this will be three. 110 111 00:08:54,250 --> 00:08:58,057 And here will be, second one is In library, OK. 111 112 00:09:00,220 --> 00:09:05,060 Books in library and value is equal to two and this one 112 113 00:09:05,060 --> 00:09:08,883 will be three and this one is Borrowed books OK. 113 114 00:09:15,060 --> 00:09:18,453 That's fine. So what I need to do now is I need to use, 114 115 00:09:18,453 --> 00:09:22,470 geometry manager of course for my radio buttons 115 116 00:09:22,470 --> 00:09:27,143 and here "rb1.grid" row is one and column is equal to zero 116 117 00:09:33,670 --> 00:09:38,670 again control + D and control + D. That one is going to be one, 117 118 00:09:40,310 --> 00:09:43,727 that one is two and this one is three, 118 119 00:09:43,727 --> 00:09:47,653 and that one is two, OK. And if I run my application now, 119 120 00:09:48,980 --> 00:09:52,835 you see, our text is here and all books, in library, 120 121 00:09:52,835 --> 00:09:55,700 borrowed books is here. So what I need to do now, 121 122 00:09:55,700 --> 00:09:58,140 I will create here a button right. 122 123 00:09:58,140 --> 00:10:03,140 And for button I will say here "btn_list" is going to, 123 124 00:10:05,390 --> 00:10:08,460 we are going to use Button constructor method, 124 125 00:10:08,460 --> 00:10:13,460 list bar, and the text is equal to List books, OK. 125 126 00:10:18,930 --> 00:10:22,220 And other one is going to be bg is 126 127 00:10:27,159 --> 00:10:32,159 2488ff and fg simply will be white 127 128 00:10:38,086 --> 00:10:41,586 and the font, font property is going to be 128 129 00:10:45,012 --> 00:10:48,679 Arial, 12, I will not use bold for this guy. 129 130 00:10:49,960 --> 00:10:54,367 And here I need to use "btn_list.grid" and for grid row is 130 131 00:10:57,760 --> 00:11:02,760 equal to one and column is equal to three 131 132 00:11:02,820 --> 00:11:07,820 because this one is rb3 and 2, right? 132 133 00:11:09,710 --> 00:11:14,710 And other one is padx is equal to 40 and pady is equal to 10 133 134 00:11:18,940 --> 00:11:22,130 If I run my application now, I think is fine everything. 134 135 00:11:22,130 --> 00:11:26,980 As you see now is great, my list books button is here. 135 136 00:11:26,980 --> 00:11:29,704 My text is here. And for now that's all. 136 137 00:11:29,704 --> 00:11:34,287 In next lesson we are going to create other widgets OK. 137 138 00:11:36,858 --> 00:11:39,793 We will try to finish our design for this application. 138 139 00:11:39,793 --> 00:11:43,126 For now that's all. See you in the next.