This article is part of a Python Tkinter series written by Pratik Shukla. Check out his Medium account to read his other articles. And stay tuned for more Tkinker articles from Pratik!
Tkinter is Python’s standard interface to the Tk GUI (Graphical User Interface) toolkit and the de facto standard GUI. A GUI allows you to interact with a computer using visual items such as windows, icons, and menus, used by most modern operating systems. This a powerful tool useful for building all sorts of projects, and it makes it easier to visualize your code.
In this article, we’ll see basics of Tkinter and different types of widgets we can use in a Python application. Later in this article, we’ll develop a cool number guessing game using Tkinter widgets.
Today, we will cover:
Before building our games, we need to know some basics of Tkinter. The Tkinter package is the standard python interface to the Tk GUI toolkit. We generally use Tkinter package to insert different GUI widgets in our application to make it more user friendly. If you work with Python on Linux, Windows, or Mac, Python Tkinter is already installed on your device.
The basic process for creating a GUI application is as follows:
Let’s now see how we can create a simple tkinter window:
First of all we are going to import tkinter module. It contains all the functions, classes and other things we are going to need to build our application. Now as we have imported the module we need to initialize our tkinter. For that we create Tk( )
root widget. Now this will create our main GUI window in which we are going to add our widgets. At this point our main window have only title bar.
We should create only one window for our application and this window must be created before adding any other widgets in it. After then we use root.mainloop( )
. The main window we just created won’t appear unless we enter the mainloop
. When we press the close button, our program will exit the main loop. Our application will keep running until we press the close button.
Code used to create a simple tkinter window:
#import required librariesfrom tkinter import *# initialize tkinter :root = Tk()# enter the main Loop :root.mainloop()
Now we’ll take a brief look at some of the widgets we are going to need in out application. Keep in mind that here we’re going to take simplest example demonstrating the widget. There are many more features available in each widgets. We’ll see some of them while developing our game.
Button: The button widget is used to display buttons in our application. Generally when we press a button there will be a command associated with it.
# Import required libraries :from tkinter import *# Initialize tkinter :root = Tk()# Adding widgets :# Add button :btn = Button(root,text="PRESS ME",command=lambda:press())# Place button in window :btn.grid(row=0,column=0)# Define the function :def press()lbl = Label(root,text="You Pressed The Button")lbl.grid(row=0,column=1)# Enter the main Loop :root.mainloop()
Label: The label widget is used to provide single line caption for other widgets in our application.
# Import required libraries :from tkinter import *# Initialize tkinter :root = Tk()# Adding widgets :# Add label :lbl = Label(root,text="This is label")# Place the button on window :lbl.grid(row=0,column=1)# Enter the main Loop :root.mainloop()
Canvas: The canvas widget is used for drawing various shapes.
# Import required libraries :from tkinter import *# Initialize tkinter :root = Tk()# Adding widgets :# Add canvas :# Create canvas object :c = Canvas(root,bg="3389db",height=250,width-300)# Draw a straight line :line = c.create_line(0,0,50,50)# To fit the line in the windowc.pack()# Enter the main looproot.mainloop()
CheckButton: We use checkbutton to display multiple options available to users. Here users can choose more than one options.
# Import required libraries :from tkinter import *# Initialize tkinter :root = Tk()# Adding widgets :# Add checkbutton :# IntVar() hold integers# Default value is 0# If checkbox is marked, this will change to 1checkvar1 = IntVar()checkvar2 = IntVar()# Create checkbuttonc1 = Checkbutton(root,text="BMW", variable=checkvar1)c2 = Checkbutton(root,text="Audi",variable=checkbar2)# To fit in the main windowc1.grid(row=0,column=0)c2.grid(row=1,column=0)# Enter the main Looproot.mainloop()
Entry: The Entry widget is used to take single line input from user.
# Import required librariesfrom tkinter import *# Initialize tkinterroot = Tk()# Adding widgets# Labellbl = Label(root,text="Enter your name:")lbl.grid(row=0,column=0)# Entrye = Entry(root)e.grid(row=0,column=1)# Enter the main Looproot.mainloop()
Frame: It’s used as a container widget to organize other widget in the same application.
# Import required librariesfrom tkinter import *# Initialize tkinterroot = Tk()# Adding widgetsframe = Frame(root)frame.pack()# Add button on LeftA = Button(frame,text="A")A.pack(side = LEFT)# Add button on RightB = Button(frame,text="B")B.pack(side = RIGHT)# Enter the main Looproot.mainloop()
Listbox: It’s used to provide list of options to users.
# Import required librariesfrom tkinter import *# Initialize tkinterroot = Tk()# Adding widgets# Create Listbox :Lb = Listbox(root)# Add items in listLb.insert(1,"A")Lb.insert(2,"B")Lb.insert(3,"C")Lb.insert(4,"D")# Place listbox on windowLb.grid(row=0,column=0)# Enter the main Looproot.mainloop()
When the user runs the program, our code will generate a random number between 0–9. The user will be unaware of the randomly generated number. Now the user has to guess the value of the randomly generated number. The user enters the value in the entry box.
After that, the user will press the check button. The button will trigger a function. The function will check whether the number entered by user matches the randomly generated number. If the guessed number is correct, then the program will display the CORRECT label and the actual number (which, in this case, will be same as guessed number).
Now, if the guessed number is less than the randomly generated number, then our program will show the TOO LOW label, and this will also clear the entry box, so that the user can enter a new number.
If the guessed number is higher than the actual number, then our program will show the TOO HIGH label and clear the entry box. This way the user can continue guessing the correct number.
If the label shows TOO HIGH, then the user is supposed to enter a lower number than they guessed. If the label shows TOO LOW, then the user is supposed to enter a higher number than they guessed the first time.
Our program will also count the number of attempts it took the user to guess the correct number. It will show the total attempts when the user finally make the correct guess.
If the user wants to play a new game, they have to press the main close button. If the user presses the CLOSE button in our application then they will exit the game completely.
Putting it in simple steps:
You can download the images and the code files used in the application from here. Or, to see the final code for this game, click here to reach the end of the article.
We’ll show you step-by-step how to build the above game using Python tkinter. Let’s jump right in.
Step 1: Import the required libraries
# import required libraies :from tkinter import * # to add widgetsimport random # to generate a random numberimport tkinter.font as font # to change properties of fontimport simpleaudio as sa # to play sound files
Step 2: Creating main tkinter window
want_to_play = Truewhile want_to_play==True:root = Tk()root.title("Guess The Number!")root.geometry('+100+0')root.configure(bg="#000000")root.resizable(width=False,height=False)root.iconphoto(True,PhotoImage(file="surprise.png"))
want_to_play
and set its value to True
. Our program will generate a new window when the variable is set to True
. When the user presses the main close button, it will exit the loop, but here we’ve set the variable to True
, so it will create another window with newly generated number.root = Tk( )
: This is used to initialize our tkinter module.root.title( )
: We use it to set the title for our application.root.geometry( )
: We use this to specify at which location our application window will open.root.configure( )
: We use this to specify the background color for our application.root.resizable( )
: Here we are using it to prevent the users from resizing our main window.root.iconphoto( )
: We are using it to set the icon in the title bar for our application window. We are setting the first parameter to True
.Step 3: Importing sound files
# to play sound filesstart = sa.WaveObject.from_wave_file("Start.wav")one = sa.WaveObject.from_wave_file("Win.wav")two = sa.WaveObjet.from_wave_file("Lose.wav")three = sa.WaveObject.from_wave_file("Draw.wav")start.play()
Now we will use some sound files that will play at various events. When our program starts it will play start file. We’ll play the rest three files when the user’s guess is correct, when the user’s guess is wrong and when user closes the application respectively. One thing to notice is that it only accepts .wav
files. First of all we need to load the sound file in an object. Then we can play it using .play( )
method when required.
Step 4: Loading images for our application
We are going to use various images in our application. To use those images first we need to load those images. Here we are going to use PhotoImage class to load our images.
# Loading imagesCheck = PhotoImage(file="Check_5.png")High = PhotoImage(file="High_5.png")Low = PhotoImage(file="Low_5.png")Correct = PhotoImage(file="Correct_5.png")Surprise = PhotoImage(file="Surprise.png")your_choice = PhotoImage(file="YOUR_GUESS.png")fingers = PhotoImage(file="fingers.png")close = PhotoImage(file="Close_5.png")
Step 5: Generating a random number
Here we’re going to generate a random number between 1–9. We are going to use the random module to generate random integer between 1–9.
# generating random numbernumber = random.randint(1,9)
Step 6: Modify fonts
Here we’ll use the font module to change the fonts in our application.
# using font module to modify fontsmyFont = font.Font(family='Helvetica',weight='bold')
Step 7: Adding widgets
Here we have added the first two widgets of our application. Notice that the entry box is at row 2 since we have added blank space in row 1. Here we are going to use an image file in our label. We use .grid( )
to specify the location of a particular widget.
# Creating first labellabel = Label(root,image=your_choice)label.grid(row=0,column=1)# Creating the entry boxe1 = Entry(root,bd=5,width=13,bg="9ca1db",justify=CENTER,font=myFont)e1.grid(row=2,column=1)
Step 8: Creating other widgets
Here we’ll add some other widgets like button and label. There will be two buttons one to check the value and other to close the window permanently. The second label will show whether the value guessed by the user is correct or high or low. It will show the label accordingly. The third label reveals the correct number if user’s guess is correct.
The fourth label reveals the total number of attempts it took the user to guess the correct value. Here notice that the two buttons will trigger a command. We will take a look at that in the next points.
# Creating check button :b1 = Button(root,image=Check,command=lambda:show())b1.grid(row=4,column=3)# Creating close button :b2 = Button(root,image=close,command=lambda:reset())#Creaating second label :label2 = Label(root,image=fingers)label2.grid(row=6,column=1)#Creating third label :label3 = Label(root,image=Surprise)label3.grid(row=10,column=1)#Creating fourth label :label4= Label(root,text="ATTEMPTS : ",bd=5,width=13,bg="#34e0f2",justify=CENTER,font=myFont)label4.grid(row=12,column=1)
Step 9: Display the correct image and set the counter to the attempt values
Here we are going to display the correct number image when the user’s guess is right. Our digits are stored like:
So our program will take the actual number and add the .png string with it and open that file. We will also set the counter to count the attempt values. It will store the value of number of attempt it take user to guess the correct number.
# to display the correct imagenum = PhotoImage(file = str(number)+str(".png"))# Set the count to 0count = 0
Step 10: Function that will trigger when we press the check button
Here whenever the user presses the check button the count values for number of attempts will increase by one. Then we are storing the value entered by user in the variable called answer. Then we will check if the user hasn’t entered any value and pressed the check button the it will go to the reset()
function and the application will close.
Now we have to convert the value entered by user to integer as we are going to compare it with the actual number.
def show():#Increase the count value as the user presses check button.global countcount = count+1#Get the value entered by user.answer = e1.get()#If the entry value is null the goto reset() function.if answer=="":reset()#Convert it to int for comparision.answer = int(e1.get())if answer > number:#Play sound file.two.play()#Change the label to Too High.label2.configure(image=High)#Calls all pending idle tasks.root.update_idletasks()#Wait for 1 second.root.after(1000)#Clear the entry.e1.delete(0,"end")#Change the label to the original value.label2.configure(image=fingers)elif answer < number:#Play sound file.two.play()#Change the label to Too Low.label2.configure(image=Low)#Calls all pending idle tasks.root.update_idletasks()#Wait for 1 second.root.after(1000)#Clear the entry.e1.delete(0,"end")#Change the label to the original value.label2.configure(image=fingers)else:#Play sound file.one.play()#Show the CORRECT image.label2.configure(image=Correct)#Show the correct number.label3.configure(image=num)#Show the number of attempts.label4.configure(text="ATTEMPTS : "+str(count))
Step 11: Close button that will trigger the reset()
function
This function will set the want_to_play
variable to False
so that our application will close and will not start again. Then it will close the main window of our application.
# define reset() functiondef reset():# Play sound filethree.play()# Change the variable to falseglobal want_to_playwant_to_play = false# Close the tkinter windowroot.destroy()
Step 12: Main loop
We have to enter the main loop to run the program. If our program doesn’t have this line then it will not work. Our program will remain in the main loop until we press the close button.
# Enter the mainLooproot.mainloop()
#Import required libraries :from tkinter import *import randomimport tkinter.font as fontimport simpleaudio as sawant_to_play = Truewhile want_to_play==True:root = Tk()root.title("Guess The Number!")root.geometry('+100+0')root.configure(bg="#000000")root.resizable(width=False,height=False)root.iconphoto(True,PhotoImage(file="surprise.png"))#To play sound files:start = sa.WaveObject.from_wave_file("Start.wav")one = sa.WaveObject.from_wave_file("Win.wav")two = sa.WaveObject.from_wave_file("Lose.wav")three = sa.WaveObject.from_wave_file("Draw.wav")start.play()#Loading images :Check = PhotoImage(file="Check_5.png")High = PhotoImage(file="High_5.png")Low = PhotoImage(file="Low_5.png")Correct = PhotoImage(file="Correct_5.png")Surprise= PhotoImage(file ="Surprise.png")your_choice = PhotoImage(file="YOUR_GUESS.png")fingers = PhotoImage(file = "Fingers.png")close = PhotoImage(file="Close_5.png")#To have space between rows.root.grid_rowconfigure(1, minsize=30)root.grid_rowconfigure(3, minsize=30)root.grid_rowconfigure(5, minsize=30)root.grid_rowconfigure(9, minsize=30)root.grid_rowconfigure(11, minsize=30)#Generating random number :number = random.randint(1,9)#Using font module to modify the fonts :myFont = font.Font(family='Helvetica',weight='bold')#Creating the first label :label = Label(root,image=your_choice)label.grid(row=0,column=1)#Creating the entry box :e1 = Entry(root,bd=5,width=13,bg="#9ca1db",justify=CENTER,font=myFont)e1.grid(row=2,column=1)#Creating check button :b1 = Button(root,image=Check,command=lambda:show())b1.grid(row=4,column=3)#Creating close button :b2 = Button(root,image=close,command=lambda:reset())b2.grid(row=4,column=0)#Creaating second label :label2 = Label(root,image=fingers)label2.grid(row=6,column=1)#Creating third label :label3 = Label(root,image=Surprise)label3.grid(row=10,column=1)#Creating fourth label :label4= Label(root,text="ATTEMPTS : ",bd=5,width=13,bg="#34e0f2",justify=CENTER,font=myFont)label4.grid(row=12,column=1)#To display the correct image :num = PhotoImage(file=str(number)+str(".png"))#Set the count to 0.#It stores the attempt value.count = 0def show():#Increase the count value as the user presses check button.global countcount = count+1#Get the value entered by user.answer = e1.get()#If the entry value is null the goto reset() function.if answer=="":reset()#Convert it to int for comparision.answer = int(e1.get())if answer > number:#Play sound file.two.play()#Change the label to Too High.label2.configure(image=High)#Calls all pending idle tasks.root.update_idletasks()#Wait for 1 second.root.after(1000)#Clear the entry.e1.delete(0,"end")#Change the label to the original value.label2.configure(image=fingers)elif answer < number:#Play sound file.two.play()#Change the label to Too Low.label2.configure(image=Low)#Calls all pending idle tasks.root.update_idletasks()#Wait for 1 second.root.after(1000)#Clear the entry.e1.delete(0,"end")#Change the label to the original value.label2.configure(image=fingers)else:#Play sound file.one.play()#Show the CORRECT image.label2.configure(image=Correct)#Show the correct number.label3.configure(image=num)#Show the number of attempts.label4.configure(text="ATTEMPTS : "+str(count))#Define reset() function :def reset():#Play the sound file.three.play()#Change the variable to false.global want_to_playwant_to_play = False#Close the tkinter window.root.destroy()#Enter the mainloop :root.mainloop()
Congrats! You’ve reached the end and built a successful Python Tkinter game. Great work applying your Python knowledge. I hope you enjoyed this article and learnt something new from it. In this series on Tkinter we’ll be developing a total of Five games using Tkinter. So, hang tight!
If you have any doubts, questions, or thoughts regarding this article, feel free to contact me at shuklapratik22@gmail.com
Join a community of 1.7 million readers. Enjoy a FREE, weekly newsletter rounding up Educative's most popular learning resources, coding tips, and career advice.