Introduction7:48 with Kenneth Love
Tkinter is a library provided with Python for building GUI applications. Let's learn how to start using it and see if we can make something show up on the screen.
The official docs for Tkinter aren't the best in the world but they'll get you started. The documentation from effbot hasn't been updated in about a decade but it's actually still mostly accurate. These are my two main resources for learning Tkinter and preparing this workshop.
Terms and things
Tk() - A Tkinter application. This is what is responsible for the window or application you see on your screen. You'll end up binding most things to this.
mainloop() - The loop that keeps your Tkinter app running. This loop runs forever.
Frame - An invisible box that you can put things in.
Label - A piece of text on the screen.
Button - A button (whodathunk?!)
StringVar - A variable that holds onto a string.
IntVar - A variable that holds onto an int.
trace() - A way to follow the changes and access of a variable.
rowconfigure() - Methods to configure the number and weight of columns and rows.
pack() - Method to insert a widget in the available space.
[MUSIC] 0:00 >> So, stay with me for a second. 0:04 There's a language for making Graphical User Interfaces, or GUI's, named TCL. 0:06 Which is pronounced, Tickle. 0:10 It's not a really difficult language to use, but it's not as friendly as Python. 0:13 TCL has a library for making widgets. 0:17 Widgets are things like buttons and inputs and icons. 0:20 This library is known as Tk. 0:23 In Python, we have a handy built-in library named Tkinter for 0:25 building Tcl GUIs with Tk's widgets. 0:29 Tkinter turns Python code into Tcl code. 0:32 If you want to build GUI applications in Python, Tkinter is the place to start. 0:36 TkInter applications run on pretty much any desktop operating system, 0:40 and thanks to Tk8.5 integration, the apps will look native too. 0:43 So let's see what all is involved in creating GUI's with Tkinter and Python. 0:48 All right. So couple of things. 0:53 I think this is the first workshop where you've seen me use PyCharm. 0:55 PyCharm is an IDE from Jet Brains that works really well for Python stuff. 0:59 I could have built what we're going to do in Sublime text or 1:05 anything else but I wanted to do it in PyCharm just so you could see PyCharm. 1:09 I may do a course over IDEs later so we'll see. 1:14 In this workshop, we're going to build a pomodorro application. 1:18 If you don't know what pomodorro is. 1:22 It's kind of a work flow thing, the idea is that you work for 1:24 25 minutes on some thing that you can do in 25 minutes and 1:29 then when the 25 minutes runs out you stop working, you take like a five minute 1:34 break, you come back, you do this twice and you've worked for an hour. 1:38 Do it four times you work for two hours. 1:42 Somewhere in there, like say after two hours, you stop and take a longer break. 1:44 Maybe a 15, 20 minute break. 1:47 Our timer's gonna be pretty simple, our app's gonna be pretty simple. 1:50 We're gonna have like a logo thing at the top, 1:53 we're gonna have a countdown timer, and then we're gonna have a couple of buttons 1:54 one that starts our 25 minute timer and one that stops it. 1:58 We're not gonna record what you did on the 25 minutes or 2:02 anything like that, just you can add all that yourself. 2:05 That's a great thing for you to add at the end of this workshop all by yourself. 2:10 Sadly we can't play an alert sound at the end when we're using just Tkinter. 2:14 But we'll pop up a dialogue window and that'll get our attention. 2:18 Now before we jump all the way into the app, 2:22 I wanna just show you some of the ideas of Tkinter because there's a lot to Tkinter. 2:24 So I'm gonna make a new file. 2:28 And I'm just gonna call this one, 2:31 let's just call this intro.pi, this is gonna be a basic thing. 2:32 Now most people import everything from the Tkinter library. 2:36 They'll do from Tkinter import start. 2:39 I really don't like that. 2:42 I find that really messy. 2:44 So I'm just going to import tkinter. 2:45 So one of the basic things that tkinter requires is that we have to 2:48 Create a root window or a root app. 2:52 So, to do that we instantiate this TK class. 2:55 The TK in Tkinter is for TK, which is a widget library for the TCL language. 3:02 And then to make this run forever we actually do a root dot Mainloop. 3:08 And if we run this, yup, 3:14 just run that, then we get, let me pull it over here, we get this little window. 3:19 And there's nothing in it, and it's just this window. 3:24 There's nothing there. 3:26 Not the most exciting thing ever. 3:28 But it's okay. 3:30 It's a little, it's a little thing, right? 3:31 We probably wanna show something in here. 3:35 So let's make some text with a label. 3:36 Label is the class that let's us make just text stuff. 3:41 So we'll say, hi there. 3:47 And it's a Tkinter.label. 3:50 And labels have a few different attributes. 3:52 The first thing we have to do is we have to say, what does this label belong to? 3:55 And it's gonna belong to our root object. 4:02 And then we can set some text on it. 4:06 So let's just set the text Hi there. 4:08 Yeah I think that's it, that's good for now. 4:11 So later on we're gonna use this thing that's known as a grid, but 4:13 for now we're gonna use a method that's called pack. 4:16 And pack just lets Tkinter figure out where objects should go. 4:20 So we'll do hi_there.pack and we'll save and 4:24 we'll run and then, oh, let me see if I can bring this over. 4:30 So small. 4:37 There it is, look at that. 4:39 It says, Hi there. 4:39 I mean, it's not even big enough. 4:41 There, that's a little better. 4:42 It's not even big enough to see all three buttons. 4:44 So that's the absolute minimum basics to get something on there. 4:45 And that's kinda cool, I mean, that's really simple. 4:49 That's only been a few lines of code. 4:52 So let's kill that. 4:54 That's a little hard to see. 4:56 Let's add some color and some strechiness to it, all right? 4:58 Let's make it a little bit more interesting. 5:02 So we can set two colors here. 5:04 We can do bg or we can do background. 5:05 But bg is less typing. 5:09 And then we give it a string of the color to use. 5:11 I'll link to the docs, there's a whole list of colors. 5:14 And then let's say white for the fg or foreground and 5:17 then inside pack here we can specify a couple of things. 5:21 We can specify fill and so 5:25 fill is what direction do you want me to make this thing fit. 5:28 And so we can use Tkinter.x and it'll fit across horizontally. 5:35 Or filter.y and it'll fit vertically. 5:40 Or we can do both and it'll do both of those. 5:43 But since we need it to change size, we also have to set expand equals True. 5:47 We could say expand equals one, something like that, but expand equals true. 5:53 Let's run that one. 5:57 Sorry these all appear offscreen and I have to bring them over. 5:59 So now, ooh stretchy. 6:03 So again, not super exciting. 6:07 But kinda cool, it works. 6:10 Let's add another item to it, let's add another widget. 6:13 By the way, labels, all this stuff, these are called widgets. 6:17 So let's add another widget. 6:20 We'll just say my_name, and tkinter.label, it belongs to root. 6:22 And the text, I'm gonna set, My name is Kenneth. 6:28 Feel free to put your own name in there. 6:32 And then, of course, to put the label into the object that it belongs to, 6:34 in this case root, we have to pack it. 6:40 So my_name.pack. 6:42 And run it again. 6:47 And here we go. 6:50 They sit nicely on top of each other. 6:51 Now, this is what's kind of cool, because we have this fill and this expand, 6:54 and then this one's packed in. 6:58 It's packed on the bottom. 7:00 So if we resize this window, woo, 7:02 the name label stays the size that it just is automatically. 7:07 And the other one still takes up as much room as it needs to. 7:11 So that's kind of cool. 7:15 That's kind of neat to be able to do that. 7:16 I don't really like using pack. 7:19 I find it a little bit harder to predict exactly where things are gonna go. 7:22 I mean you can pack it to a side, you can say like, hey put this on the left, 7:27 put this on the right, stuff like that. 7:30 But it's a little bit like using floats in CSS. 7:31 So, to me it's just a little bit harder to figure out exactly what's going to happen. 7:35 So, let's start a new script and we'll start on our actual application. 7:42
You need to sign up for Treehouse in order to download course files.Sign up