Tkinter (ttk) graphical user interface for Python

This document shows how to program a Python Tkinter Themed Tk (ttk) graphical user interface (GUI) for both text and numerical data entry. Tkinter ttk provides enhanced widgets that can simplify creating GUI windows.

Note: Before you can program and run ttk data-entry widgets, you need to download and install Python 3 and IDLE for Python 3. IDLE is the Python integrated development environment (IDE). For details, see Getting Started with Python Programming.

Creating a ttk planning grid
Before you start programming your ttk GUI window, you should create a planning grid that helps you organize your Entry, Label and Button widgets into rows and columns. To create your ttk grid, you can either make a pencil sketch or use a word-processor table similar to Figure 1.

Figure 1 - You can use a word-processor table to create your ttk planning grid.

Note: Compare Figure 1 with Figures 2 and 3. Figure 2 shows the initial example window. Figure 3 shows the results of entering data into that window.

Figure 2 - Example ttk GUI window prior to data entry.

Figure 3 - Example ttk GUI window after data entry.

Programming a ttk GUI window
The example Python program in Figures 4 and 5 contain Python code that defines the example ttk GUI window in Figures 2 and 3. Note: A # character precedes each comment.

Figure 4 includes code that:

• Imports both tkinter and ttk.
• Defines callable GUI functions using the get() and set() control-variable  methods:
• The texter() function gets input data for variable 'textin,' and sets the output data for variable 'textout.'
• The adder() function gets input data for variables 'a' and 'b,' and sets the output data for the variable 'total.

Figure 4 - This ttk example code includes function definitions.

Figure 5 includes code that:

• Sets up a self-sizing GUI window based on the example ttk planning grid in Figure 1.
• Defines two ttk.Button widgets:
• According to planning grid row 3, column 3, 'command=texter'  calls the texter() function in Figure 4.
• According to planning grid row 7, column 3, 'command=adder'  calls the adder() function in Figure 4.

Figure 5 - This ttk example code sets up the GUI window
and defines two button widgets.

Running the ttk example
Before you can run the ttk example Python program, you need to either download (or type) it into into a new file.

Downloading and running the ttk example - To download and then run the example ttk, do the following:

1. In a new browser window or tab, go to Tkinter ttk Data Entry.
2. Select the entire program, and then press Ctrl+C to copy the code.
3. Start Python 3 and open a new window in IDLE.
4. Click File, click New File, and then press Ctrl+V to paste your copied code into your new file.
5. Save your new file with an appropriate file name, such as TtkExample.py, and then click Run Module.
6. Test the ttk example by entering text and numerical values. See Figures 2 and 3.

Typing and running the ttk example
If you are new to Python, you might wish to type the example ttk as extra practice. To type and run the example GUI, do the following:

1. Start Python 3 and open a new window in IDLE.
2. Click File, click New File, and then type the code from Figures 4 and 5 into your new file. 
3. Save your new file with an appropriate file name, such as TtkExample.py, and then click Run Module.
4. Test the ttk example by entering text and numerical values. See Figures 2 and 3.

Tkinter graphical user interface for Python

Tkinter is the most popular graphical user interface (GUI) for the Python programming language. Tkinter automatically installs with Python. This document describes example code through which you can create a new desktop window that contains active buttons and dynamic labels.

I thank Webucator for creating an excellent video presentation based on this document, and including it in a free lesson, Python Solutions from the Web. Webucator also provides commercial Python Online and Onsite Training Classes.

Note: Before you can create and run the example program in this document, you need both Python 3 and IDLE for Python 3, which is its Integrated Development Environment (IDE). For more information, see Getting started with Python programming.

Example GUI overview
Figjures 1, 2 and 3 contain the example GUI example code. Note: In these figures, # characters precede red comment text that shows how Tkinter widgets define these example buttons and labels.

Figure 1 - This code defines the Button Test window,
its instruction text, and its Exit Program button.

Figure 2 - This code defines the GREEN and BLUE buttons.

Figure 3 - This code defines the Reset button.

Downloading and running the example GUI
To download and then run the example GUI, do the following:

1. In a new browser window or tab, go to Tkinter Buttons and Labels.
2. Select the entire program, and then press Ctrl+C to copy the code.
3. Start Python 3 and open a new window in IDLE.
4. Click File, click New File, and then press Ctrl+V to paste your copied code into your new file.
5. Save your new file with an appropriate file name, such as TkinterExample.py, and then click Run Module.
6. Test the buttons according to the Testing the example GUI section below.

Typing and running the example GUI
If you are new to Python, you might wish to type the example GUI as extra practice. To type and run the example GUI, do the following:

1. Start Python 3 and open a new window in IDLE.
2. Click File, click New File, and then type the code from Figures 1, 2, and 3 into your new file. 
3. Save your new file with an appropriate file name, such as TkinterExample.py, and then click Run Module.
4. Test the buttons according to the Testing the example GUI section below.

Testing the example GUI
After downloading or typing the example GUI, test it as follows:

1. Click the GREEN button to display "You clicked the green button" in its label field.
2. Click the BLUE button to display "You clicked the blue  button."
3. Click the RESET button should clear the label fields for the GREEN and BLUE buttons.
4. Repeat steps 1 through 3 to verify that the print() functions display correctly in the Python Shell. For example, clicking the BLUE button should also display "Thank you for clicking the BLUE button" as shown in Figure 4.
5. Click the Exit Program button to close the Button Test window.

Figure 4 - Clicking the BLUE button should display one message in the
Button Test window, and another in the Python Shell window.