Working with Widgets

00:00 Working With Widgets Widgets are the bread and butter of tkinter. They’re the elements through which users interact with your program. Each widget in tkinter is defined by a class and on screen you can see some of the widgets available.

00:16 You’ll see how to work with each of these in the following sections of the course, but keep in mind that tkinter has many more widgets than those listed on screen.

00:27 For a full list of Tkinter widgets, you can check out basic widgets and more widgets in the TkDocs tutorial. Even though it describes themed widgets introduced in Tcl/Tk 8.5, most of the information there should also apply to the classic widgets. Label widgets are used to display text or images.

00:50 The text displayed by a label widget can’t be edited by the user. It’s for display purposes only. As you saw earlier, you can create a label widget by instantiating the Label class and passing a string to the text parameter.

01:05 Label widgets display text with the default system text color, and the default system text background color. These are typically black and white respectively, but you may see different colors if you’ve changed these settings in your operating system, such as when you’re using dark mode.

01:21 You can control label text and background colors from the foreground and background parameters.

01:50 Many of the HTML color names work with Tkinter. For a full reference, including the macOS, and Windows specific system colors that the current system theme controls, check out the colors manual page linked on screen.

02:06 You can also specify a color using hexadecimal RGB values. This sets the label background to a light blue color. Hexadecimal RGB values are more cryptic than name colors, but they’re also more flexible.

02:20 Fortunately, there are tools available that make getting hexadecimal color codes relatively painless. If typing out foreground and background is too long, then you can use the shorthand fg and bg parameters to set the foreground and background respectively.

02:37 You can also control the width and height of a label with the width and height parameters.

02:53 You can see the effect of this on screen.

02:58 It may seem strange that the label in the window isn’t square, even though the width and height are both set to 10. This is because the width and height are measured in text units.

03:08 A horizontal text unit is determined by the width of the character zero in the default system font. Similarly, a vertical text unit is defined by the height of the character zero.

03:19 This ensures consistent behavior of the application across platforms and ensures that text fits properly in labels and buttons regardless of where it’s running.

03:29 Button widgets are used to display clickable buttons. You can configure them to call a function whenever they’re clicked. You’ll cover how to call functions from button clicks later on in the course.

03:40 But for now, let’s look how to create and style a button. There are similarities between button and label widgets. In many ways, a button is just a label that you can click.

03:51 The same keyword arguments that you use to create and style a label will work with button widgets. For example, this code creates a button with a blue background and yellow text.

04:04 It also sets a width and height to 25 and 5 text units respectively.

04:14 Here’s what the button looks like on Windows.

04:19 If you’re running a recent version of macOS, then you’ll find that the code just seen doesn’t change the background color of the button. On screen, you can see the button which results from running that code.

04:31 You can see the text color has changed, but the background hasn’t. This is due to changes in the way that macOS works. So if you really want to change the background color of a button, then you’ll need to use an alternate solution such as tkmacosx.

04:47 This is a library extension that provides an alternative implementation of button, allowing for changes to the background color as seen with the code on screen.

04:59 Note, that button is imported from tkmacosx and then used instead of the standard Tkinter button. But also note that the size of the button is given in pixels, not text units, so this will make cross-platform implementation more complex.

05:25 It may well be worth sacrificing the ability to change the background color of a button in favor of code which runs without modification across multiple platforms.

05:35 But that’s a decision you’ll have to weigh up yourself.

05:39 In the next section of the course, we’ll take a look at how you can get user input with entry widgets.