Basic GUI Programming using Tkinter

1 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
 Objectives
❑ To create a simple graphical user interface (GUI) application with Tkinter
(§10.2).
❑ To process events by using callback functions that are bound to a widget’s
command option (§10.3).
❑ To use labels, entries, buttons, check buttons, radio buttons, messages, and text
to create graphical user interfaces (§10.4).
❑ To draw lines, rectangles, ovals, polygons, and arcs and display text strings in a
canvas (§10.5).
❑ To use geometry managers to lay out widgets in a container (§10.6).
❑ To lay out widgets in a grid by using the grid manager (§10.6.1).
❑ To pack widgets side by side or on top of each other by using the pack manager
(§10.6.2).
❑ To place widgets in absolute locations by using the place manager (§10.6.3).
❑ To use images in widgets (§10.9).

2 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
 Introduction
❑ Tkinter (pronounced T-K-Inter) is short for “Tk interface.”
❑ Tk is a GUI library used by many programming languages for developing GUI
programs on Windows, Mac, and UNIX.
❑ Tkinter provides an interface for Python programmers to use the Tk GUI
library, and it is the de-facto standard for developing GUI programs in Python.
❑ The Tkinter module contains the classes for creating GUIs. The Tk class
creates a window for holding GUI widgets (i.e., visual components).
❑ Whenever you create a GUI-based program in Tkinter, you need to import the
tkinter module and create a window by using the Tk class

3 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
 Introduction

❑ First a window is created using the Tk class.

❑ Label and Button are Python Tkinter widget classes for creating labels and
buttons.
❑ The first argument of a widget class is always the parent container (i.e., the
container in which the widget will be placed).
❑ label.pack() places label in the container using a pack manager. In this
example, the pack manager packs the widget in the window row by row.
❑ Tkinter GUI programming is event driven. After the user interface is
displayed, the program waits for user interactions such as mouse clicks and key
presses. This is specified in the following statement: window.mainloop()

4 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
 Introduction
❑ The statement creates an event loop. The event loop processes events
continuously until you close the main window.

5 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
 Processing Events

❑ The program defines the functions processOK and processCancel. These

functions are bound to the buttons when the buttons are constructed. These
functions are known as callback functions, or handlers.

6 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
 Processing Events
❑ You can also write this program by placing all the functions in one class:

7 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
 The Widget Classes
❑ The core widget classes Tkinter provides.

8 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
 The Widget Classes

9 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
10 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
11 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
12 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
 Canvas
❑ You use the Canvas widget for displaying shapes.
❑ You can use the methods create_rectangle, create_oval, create_arc,
create_polygon, or create_line to draw a rectangle, oval, arc, polygon, or line
on a canvas.

13 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
14 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
15 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
16 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
17 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
 The Geometry Manager
❑ The Tkinter supports three geometry managers:
❑ The grid manager
❑ The pack manager
❑ The place manager

18 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
 The grid Manager
❑ The grid manager places widgets into the cells of an invisible grid in a
container. You can place a widget in a specified row and column. You can also
use the rowspan and columnspan parameters to place a widget in multiple
rows and columns

19 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
 The grid Manager

20 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
 The pack Maneger
❑ The pack manager can place widgets on top of each others or side by side.
❑ You can use the side option to place widgets side by side.

21 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
 The pack Manger

22 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
 The place Manager
❑ The place manager places widgets in absolute position.

23 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
 The Loan Calculator

24 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
 The Loan Calculator

25 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
 The Loan Calculator

26 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
 The Loan Calculator

27 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
 Displaying Images
❑ You can add an image to a Label, Button, Check Button, or Radio Button. The
file format must be either GIF or PNG.
❑ You can use create_image to display an image in a canvas

28 EE202: Object Oriented Programming (by Dr. Abdullah Balamash) Spring 2024
 EE202: Object Oriented Programming (by Dr. Abdullah
29 Balamash) Spring 2024