Exploring widgets

- [Narrator] Previously we added buttons and text boxes to our GUI. In this video, we're going to take a look at setting the focus to a widget and disabling widgets. We will then improve our GUI by adding drop-down combo boxes that can have initial default values. While our GUI is nicely improving, it would be more convenient and useful to have the cursor appear in the entry widget as soon as the GUI appears.

This video extends the previous video. Python is truly great. All we have to do to set the focus to a specific control when the GUI appears, is call the focus method on an instance of a Tkinter widget we previously created. Our current file is named setfocusdisablewidget.py. Here, we assign the TTK.Entry class instance to a variable we named name entered. Now we can give it the focus.

This code is just above main loop. Like in the previous videos, if you get some errors make sure you are placing calls to variables below the code where they are declared. We are not using OOP as of yet so this is still necessary. Later it will no longer be necessary to do this. On a Mac you might have to set the focus to the GUI window first, before being able to set the focus to the entry widget in this window. Adding this one line of Python code places the cursor into our text entry box, giving the text entry box the focus.

Okay, let's see the output. As soon as the GUI appears, we can type into this text box without having to click it first. Nice! Next, let's see how to disable widgets. To do that, we set a property on the widget. We can make the button disabled by adding this one line of Python code. It is self explanatory. We set the focus to one control and disable another widget.

So how does the output change? Let's find out. Clicking the button no longer creates any action. Remember that good naming in programming languages helps to eliminate lengthy explanations. Later on in this course, we'll go through some advanced tips on how to do this. The next step, combo box widgets. While we can restrict the user to only certain choices, at the same time, we can allow the user to type in whatever they wish.

I've opened a new file named comboboxwidget.py. Here, we're inserting another column between the entry widget and the button using the grid layout manager. Here is the code for combo box. This code, when added to the previous files, creates a GUI with a drop down combo box. Note how we assign a tuple with default values to the combo box.

These values then appear in the drop down box. We can also change them if we like, by typing in different values when the application is running. Here we're adding a second label to match the newly created combo box created in here. We assign the value of the box to a variable of a special Tkinter type, i.e., stream bar, as we did in a previous video. Here we align the two new controls, label a combo box, within our previous GUI layout.

And the last line assigns a default value to be displayed when the GUI first becomes visible. This is the first value of the number chosen, values tuple, the string 1. We did not place quotes around our tuple of integers but they got casted into strings, because we declared the values to be of type tk.StringVar. Let's check the result. Click on ComboBoxWidget.py.

Let me type hello. Select 42. The screen shot shows the selection made by the user 42. This value gets assigned to the number variable. Neat! There's something more. If we want to restrict the user to only be able to select the values we have programmed into the combo box, we could do that by passing the state property into the constructor.

I've copied the entire code from comboboxwidget.py and renamed this file as comboboxwidgetreadonly.py. Now let's edit this file. I will modify this line like so. Now users can longer type values into the combo box. We can display the value chosen by the user by adding a line of code to our button click event callback function. Let's check the result.

Now, after choosing a number, entering a name, and then clicking the button, we'll get the following GUI result. It now also displays the number selected along with the name. Great! That's about it for this video. We dove deeper into how to deal with widgets. In the next video, we'll go over adding some extra features.