0 1 00:00:04,437 --> 00:00:05,650 In this lecture we are going to learn 1 2 00:00:05,650 --> 00:00:08,180 how we can create a menu for our application. 2 3 00:00:08,180 --> 00:00:09,310 To do that, what we need to do, 3 4 00:00:09,310 --> 00:00:10,423 before creating our menu items, 4 5 00:00:10,423 --> 00:00:13,480 we need to create a menu bar for our application. 5 6 00:00:13,480 --> 00:00:15,780 What I will say here, I will create a variable. 6 7 00:00:15,780 --> 00:00:17,430 Its name is menuBar. 7 8 00:00:17,430 --> 00:00:20,540 MenuBar is equal to, I will say menu, 8 9 00:00:20,540 --> 00:00:25,540 and here I will pass in my top level window, it is root. 9 10 00:00:25,900 --> 00:00:27,493 And after that, what I need to do? 10 11 00:00:27,493 --> 00:00:31,093 I need to come here and say root.config, 11 12 00:00:32,490 --> 00:00:34,690 and I need to pass my menu. 12 13 00:00:34,690 --> 00:00:38,250 For my menu I will say menu is equal to menuBar. 13 14 00:00:41,680 --> 00:00:43,020 And after that, what I need to do here? 14 15 00:00:43,020 --> 00:00:44,680 I will create like here menus. 15 16 00:00:44,680 --> 00:00:46,690 My main menu. 16 17 00:00:46,690 --> 00:00:49,240 This is file, edit, view. 17 18 00:00:49,240 --> 00:00:50,450 They are main menu, right? 18 19 00:00:50,450 --> 00:00:53,207 Items, and there are the others, new project, new, 19 20 00:00:53,207 --> 00:00:56,144 new scratch file, this is their sub menus. 20 21 00:00:56,144 --> 00:00:58,640 So we need to create our main menu items, 21 22 00:00:58,640 --> 00:01:03,010 but what I will do, I will come here and say file. 22 23 00:01:03,010 --> 00:01:05,410 I will create three main menu items. 23 24 00:01:05,410 --> 00:01:07,700 File is equal to, I will say menu. 24 25 00:01:07,700 --> 00:01:11,274 And after it here I need to pass in my menuBar. 25 26 00:01:11,274 --> 00:01:13,610 And also we have another parameter, 26 27 00:01:13,610 --> 00:01:16,690 but I will show it later, okay? 27 28 00:01:16,690 --> 00:01:18,560 After that, what I need to do here? 28 29 00:01:18,560 --> 00:01:22,680 I need to say menuBar dot, actually let's create 29 30 00:01:22,680 --> 00:01:25,380 our main menu files and after that we can 30 31 00:01:25,380 --> 00:01:29,140 add these menu items to our main menu. 31 32 00:01:29,140 --> 00:01:34,140 And after that here, I will say edit is equal to menu, 32 33 00:01:34,900 --> 00:01:37,970 and again, menuBar. 33 34 00:01:37,970 --> 00:01:42,150 Also I want to create about menu item. 34 35 00:01:42,150 --> 00:01:45,600 About is equal to menu, 35 36 00:01:45,600 --> 00:01:49,290 and I will pass in, again, menuBar. 36 37 00:01:49,290 --> 00:01:52,540 Now we have created our main menu items, right? 37 38 00:01:52,540 --> 00:01:54,080 What we need to do now, 38 39 00:01:54,080 --> 00:01:58,130 we need to add this item to our main menu. 39 40 00:01:58,130 --> 00:01:59,980 How we can do it, I will come here 40 41 00:01:59,980 --> 00:02:03,193 and I will say menuBar.ad. 41 42 00:02:04,280 --> 00:02:09,280 Add cascade here, and first I need to use label 42 43 00:02:09,470 --> 00:02:14,470 is equal to is my menu name, file. 43 44 00:02:14,950 --> 00:02:18,610 And second parameter will be my menu 44 45 00:02:18,610 --> 00:02:20,853 and it's equal to file. 45 46 00:02:22,000 --> 00:02:23,853 Now if I run my application, 46 47 00:02:26,000 --> 00:02:28,400 as you see now my file is here, 47 48 00:02:28,400 --> 00:02:33,400 and also let's create some sub menus for our file. 48 49 00:02:34,390 --> 00:02:35,520 Here, what I will say? 49 50 00:02:35,520 --> 00:02:37,463 I will say file.add_command, 50 51 00:02:43,200 --> 00:02:46,513 and the first one we will be label is equal to new. 51 52 00:02:48,900 --> 00:02:51,720 Okay, now I will press control and D, 52 53 00:02:51,720 --> 00:02:55,313 and after that, the second one will be open, 53 54 00:02:56,340 --> 00:03:00,610 and the other one again, Control+D, duplicate it, 54 55 00:03:00,610 --> 00:03:02,243 and other one will be save, 55 56 00:03:03,680 --> 00:03:06,973 and finally last one will be exit. 56 57 00:03:13,280 --> 00:03:16,000 Here, what's wrong about this label? 57 58 00:03:16,000 --> 00:03:18,423 Label is equal to new something wrong but, 58 59 00:03:22,420 --> 00:03:26,000 and file is usually all edit, right here. 59 60 00:03:26,000 --> 00:03:27,453 Label is equal to new. 60 61 00:03:27,453 --> 00:03:29,430 This is also fine. 61 62 00:03:29,430 --> 00:03:32,270 So what's wrong here, label is equal to file, 62 63 00:03:32,270 --> 00:03:34,094 menu is equal to file. 63 64 00:03:34,094 --> 00:03:35,350 This is also fine. 64 65 00:03:35,350 --> 00:03:37,010 So what's wrong here? 65 66 00:03:37,010 --> 00:03:40,460 Label must be okay. 66 67 00:03:40,460 --> 00:03:42,353 Something wrong here. 67 68 00:03:44,060 --> 00:03:48,400 Because we used here two parentheses sorry here, 68 69 00:03:48,400 --> 00:03:52,010 and we need to delete this one, 69 70 00:03:52,010 --> 00:03:54,260 this one, and that one, 70 71 00:03:54,260 --> 00:03:55,899 and also that one. 71 72 00:03:55,899 --> 00:03:57,710 Now it's fine. 72 73 00:03:57,710 --> 00:03:59,700 There is one more here. 73 74 00:03:59,700 --> 00:04:01,133 If I run my application now. 74 75 00:04:03,220 --> 00:04:05,390 Now file, I click, as you see now 75 76 00:04:05,390 --> 00:04:07,250 new, open, save, and exit here. 76 77 00:04:07,250 --> 00:04:08,970 Here you see a string is here. 77 78 00:04:08,970 --> 00:04:11,330 If you want to remove this one string, 78 79 00:04:11,330 --> 00:04:12,510 what you need to use, 79 80 00:04:12,510 --> 00:04:13,753 you need to come here, 80 81 00:04:15,020 --> 00:04:18,092 and after file menu, it's here. 81 82 00:04:18,092 --> 00:04:18,925 MenuBar. 82 83 00:04:18,925 --> 00:04:20,720 You need to say tearoff is equal to zero. 83 84 00:04:25,134 --> 00:04:26,667 And if I run it again, 84 85 00:04:28,460 --> 00:04:32,040 now as you see we don't have this string now. 85 86 00:04:32,040 --> 00:04:32,980 And what is next? 86 87 00:04:32,980 --> 00:04:34,170 Now also I want to show you 87 88 00:04:34,170 --> 00:04:37,690 how we can use icons for our menu items. 88 89 00:04:37,690 --> 00:04:39,860 But before that, let's also use how we can use 89 90 00:04:39,860 --> 00:04:43,170 separators for our sub menu items. 90 91 00:04:43,170 --> 00:04:45,760 Here, for example, under new, 91 92 00:04:45,760 --> 00:04:49,570 if I want to use a separator, I will say here, 92 93 00:04:49,570 --> 00:04:53,143 file.add_separator. 93 94 00:04:54,640 --> 00:04:55,633 It's here. 94 95 00:04:56,490 --> 00:04:58,063 Now if I run it again, 95 96 00:05:01,050 --> 00:05:03,410 as you see now under new we have a separator. 96 97 00:05:03,410 --> 00:05:06,526 Of course you can set this separator for all of them, 97 98 00:05:06,526 --> 00:05:10,090 but I will only use for new. 98 99 00:05:10,090 --> 00:05:13,020 Also I want to show you how we can use icons 99 100 00:05:13,020 --> 00:05:14,500 for our applications. 100 101 00:05:14,500 --> 00:05:15,680 What do we need to do? 101 102 00:05:15,680 --> 00:05:19,683 By the way I already have my icon, it's here. 102 103 00:05:20,820 --> 00:05:22,590 As you see, it's exit.png. 103 104 00:05:22,590 --> 00:05:23,953 I will use this one. 104 105 00:05:25,076 --> 00:05:26,090 And here, what I need to do? 105 106 00:05:26,090 --> 00:05:28,327 I need to create an icon. 106 107 00:05:28,327 --> 00:05:30,463 I will use photo image. 107 108 00:05:33,290 --> 00:05:38,290 Before exit here, I will say icon is equal to photo image, 108 109 00:05:39,950 --> 00:05:44,430 and here I will say file is equal to 109 110 00:05:44,430 --> 00:05:45,930 pass in my directory. 110 111 00:05:45,930 --> 00:05:49,120 For my directory here is icons and after that 111 112 00:05:49,120 --> 00:05:51,010 is exit.png. 112 113 00:05:51,010 --> 00:05:52,780 I will say here, 113 114 00:05:52,780 --> 00:05:55,987 icons/exit.png. 114 115 00:05:58,810 --> 00:06:00,683 And after that, what I need to do here? 115 116 00:06:00,683 --> 00:06:02,570 I need to come here and... 116 117 00:06:05,320 --> 00:06:10,240 I will use this image parameter for my exit menu. 117 118 00:06:10,240 --> 00:06:15,240 And here I will pass in image is equal to my icon. 118 119 00:06:16,020 --> 00:06:19,423 But also we need to use compound parameter 119 120 00:06:21,780 --> 00:06:24,540 for side of our image. 120 121 00:06:24,540 --> 00:06:28,590 To do that I will say, compound is equal to, 121 122 00:06:28,590 --> 00:06:31,560 you can't say left or right, doesn't matter. 122 123 00:06:31,560 --> 00:06:33,253 Let's use left one. 123 124 00:06:35,240 --> 00:06:36,700 Now file, exit. 124 125 00:06:36,700 --> 00:06:38,470 As you see, now our icon is here. 125 126 00:06:38,470 --> 00:06:42,800 Of course you can also place your icon on the right side. 126 127 00:06:42,800 --> 00:06:43,633 And what is next? 127 128 00:06:43,633 --> 00:06:47,300 Also let's learn how we can create a command function 128 129 00:06:47,300 --> 00:06:48,860 for our menu items. 129 130 00:06:48,860 --> 00:06:51,600 Here I will come here and for exit, 130 131 00:06:51,600 --> 00:06:54,660 I will say command is equal to, 131 132 00:06:54,660 --> 00:06:58,043 let's say call function, or let's funcExit. 132 133 00:07:01,790 --> 00:07:03,030 And here, what I need to do? 133 134 00:07:03,030 --> 00:07:05,798 I need to create this function like that. 134 135 00:07:05,798 --> 00:07:06,631 FuncExit. 135 136 00:07:07,600 --> 00:07:11,330 And also I want to create a real exit function 136 137 00:07:11,330 --> 00:07:13,220 for this menu item. 137 138 00:07:13,220 --> 00:07:14,170 And what I will do, 138 139 00:07:15,050 --> 00:07:16,840 I will use message box here, 139 140 00:07:16,840 --> 00:07:18,070 but if I want, for example, 140 141 00:07:18,070 --> 00:07:20,750 if the user, they click exit menu item, 141 142 00:07:20,750 --> 00:07:24,840 we will pop up a message box 142 143 00:07:24,840 --> 00:07:27,010 and it will ask, are you sure to exit something. 143 144 00:07:27,010 --> 00:07:30,320 This will be a real one, something real. 144 145 00:07:30,320 --> 00:07:31,995 And here what we need to do? 145 146 00:07:31,995 --> 00:07:32,900 If we want to use message box, 146 147 00:07:32,900 --> 00:07:35,250 we need to import message box 147 148 00:07:35,250 --> 00:07:40,250 from Tkinter I will say import message box. 148 149 00:07:41,700 --> 00:07:43,500 And after here, what I will say, 149 150 00:07:43,500 --> 00:07:45,280 we already learned that, by the way, 150 151 00:07:45,280 --> 00:07:48,230 mbox, I will create a variable name for my message box, 151 152 00:07:48,230 --> 00:07:51,120 is equal to messagebox.askquestion. 152 153 00:07:56,683 --> 00:07:57,818 And here what I need to do? 153 154 00:07:57,818 --> 00:08:01,758 I need to use some parameters and the first one is my 154 155 00:08:01,758 --> 00:08:04,868 title, exit, and after that here 155 156 00:08:04,868 --> 00:08:08,951 is my text, and I will say, are you sure to exit? 156 157 00:08:10,181 --> 00:08:11,943 Something like that. 157 158 00:08:11,943 --> 00:08:13,475 And after that, what I need to use? 158 159 00:08:13,475 --> 00:08:15,642 I can use here icon for my 159 160 00:08:17,934 --> 00:08:18,777 message box. 160 161 00:08:18,777 --> 00:08:20,260 Of course it already has an icon 161 162 00:08:20,260 --> 00:08:22,180 but if you want to use a specific icon 162 163 00:08:22,180 --> 00:08:23,540 you can use it also. 163 164 00:08:23,540 --> 00:08:26,723 Icon is equal to, I will say, warning. 164 165 00:08:30,696 --> 00:08:31,680 What I need to do now? 165 166 00:08:31,680 --> 00:08:34,640 Now I need to use if and else statement. 166 167 00:08:34,640 --> 00:08:35,673 And here let's use, 167 168 00:08:38,750 --> 00:08:39,583 it's better. 168 169 00:08:39,583 --> 00:08:40,570 Here I will say, 169 170 00:08:40,570 --> 00:08:42,733 if mbox, 170 171 00:08:44,940 --> 00:08:48,350 if the user clicks yes button, 171 172 00:08:48,350 --> 00:08:50,113 you will say here, yes, 172 173 00:08:51,100 --> 00:08:52,630 and what we need to do, 173 174 00:08:52,630 --> 00:08:55,560 we need to destroy our window. 174 175 00:08:55,560 --> 00:08:56,910 We will quit our application. 175 176 00:08:56,910 --> 00:08:57,770 For that, what I will say? 176 177 00:08:57,770 --> 00:09:00,273 I will say root.destroy. 177 178 00:09:01,480 --> 00:09:04,030 And for else we don't need to do anything 178 179 00:09:04,030 --> 00:09:05,940 because if user click no, 179 180 00:09:05,940 --> 00:09:08,146 that means we will not do anything. 180 181 00:09:08,146 --> 00:09:10,160 So I will not use else statement for here. 181 182 00:09:10,160 --> 00:09:11,650 Only if is enough. 182 183 00:09:11,650 --> 00:09:14,173 And if I run my application, run. 183 184 00:09:15,650 --> 00:09:19,520 Now, let's come here, file, and exit. 184 185 00:09:19,520 --> 00:09:21,460 If I click exit, as you see it says, 185 186 00:09:21,460 --> 00:09:22,430 are you sure to exit? 186 187 00:09:22,430 --> 00:09:25,110 If I say no, you see nothing happened, 187 188 00:09:25,110 --> 00:09:26,693 but if I click yes, 188 189 00:09:27,770 --> 00:09:29,310 and now yes, 189 190 00:09:29,310 --> 00:09:32,170 as you see, you quit our application. 190 191 00:09:32,170 --> 00:09:35,110 This is how we can use menu for our applications. 191 192 00:09:35,110 --> 00:09:36,287 For now, that's all. 192 193 00:09:36,287 --> 00:09:37,954 See you in the next.