Python Tkinter Image + Examples

In this Python tutorial, we will learn how to add image in Python Tkinter. let us start the Python Tkinter Image with below examples.

• Python Tkinter Image
• Python Tkinter Image Display
• Python Tkinter Image Button
• Python Tkinter Image Background
• Python Tkinter Image Resize
• Python Tkinter Image Size
• Python Tkinter Image Label
• Python Tkinter Image Doesn’t Exist

Python Tkinter Image

Python Tkinter has the method PhotoImage which allows reading images in Python Tkinter. And then Image can be placed by providing adding PhotoImage variable in image property of widgets like Label, Button, Frame, etc.

• There are three ways of adding images on Python Tkinter.
  • PhotoImage
  • Pillow Module
• PhotoImage is the built-in library that comes with Python Tkinter and provides limited options. But is good to get started or for small tasks wherein the application just aims at putting the image on the screen. Also, it supports limited image extensions.
• Pillow module in Python Tkinter provides more features like you can read images of any extension, resize the image, etc. The Pillow module needs to be installed before use.
• Pillow can be installed using pip or pip3 in Python Tkinter.

pip install pillow

or

pip3 install pillow

• In our below example, we have demonstrated the use of PhotoImage. Pillow is discussed in the later sections of the same tutorial. We will be demonstrating the best method to be used in the situation.

Code

This is the basic code to demonstrate how to add images in Python Tkinter. Since the below code is just to display an image so we have used the PhotoImage method in Python Tkinter.

from tkinter import *

ws = Tk()
ws.title('PythonGuides')


img = PhotoImage(file='images/sasuke.png')
Label(
    ws,
    image=img
).pack()

ws.mainloop()

Output

In this output, image is displayed using label widget and since we have not provided any geometry so the application size is to the size of image.

Read: How to make a calculator in Python

Python Tkinter Image Display

Image in Python Tkinter can be displayed either by using the PhotoImage module or by using the Pillow library.

• In this section, we will display images using both PhotoImage and Pillow libraries. Also, we will use the create_image method from the canvas.
• Canvas is used to add images or text on the application screen.

Code using PhotoImage method

In this code, you can observe that we have not imported any libraries as PhotoImage automatically loaded when everything is imported.

from tkinter import *      

ws = Tk()
ws.title('PythonGuides')
ws.geometry('500x500')

canvas = Canvas(
    ws,
    width = 500, 
    height = 500
    )      
canvas.pack()      
img = PhotoImage(file='images/sasuke.png')      
canvas.create_image(
    10,
    10, 
    anchor=NW, 
    image=img
    )      
ws.mainloop()  

Output of PhotoImage method

The image is displayed on the canvas and it is showing incomplete because we have provided height and width of canvas less than the size of image.

Code using Pillow Library

In this code, we have imported ImageTk, the Image method from the PIL library. PIL is the short name for a pillow. Though the code looks much similar to the previous one now we can read more image extensions like jpg, png, bitmap, etc.

from tkinter import *  
from PIL import ImageTk,Image  

ws = Tk()  
ws.title('PythonGuides')
ws.geometry('500x500')

canvas = Canvas(
        ws, 
        width = 500, 
        height = 500
        )  
canvas.pack()  
img = ImageTk.PhotoImage(Image.open('images/sasuke.png'))  
canvas.create_image(
        10, 
        10, 
        anchor=NW, 
        image=img
        ) 
ws.mainloop() 

Output Of image displayed using Pillow Library

The output is similar to the PhotoImage section, and photo is incomplete because the size of the window provided is less than the original size of image.

Read: Python Tkinter Menu bar – How to Use

Python Tkinter Image Button

Button widget in Python Tkinter has image property, by providing image variable we can place image on the button widget.

• The first step in the process is to read the image and to do so we will use the PhotoImage method in Python Tkinter.
• Button in Tkinter has image property, you can provide the variable assigned to PhotoImage here.
• In this way an image can be placed on the button widget in Python Tkinter.

In this section, we will learn how to put image on the button in Python Tkinter.

Code

In this code, we have added an image on the button. User can click on the image to perform the action.

from tkinter import *

ws = Tk()
ws.title('PythonGuides')


img = PhotoImage(file='images/downloadbtn.png')
Button(
    ws,
    image=img,
    command=None
).pack()

ws.mainloop()

Output

In this output, Download image is added on the button. Users can click on this image to download the file.

Read: Python Tkinter Checkbutton – How to use

Python Tkinter Image Background

In this section, we will learn how to insert a background image in Python Tkinter. In other words, how to set background image in Python Tkinter.

• There are mainly two ways of placing background in Python Tkinter
  • Using Place layout manager we can put the background image on the label and the stretch it all the way to the screen.
  • Using canvas create_image method we can put the image on the screen and later using create_text method of canvas we can place text widget.
• Out of these two methods, second method which says using canvas is more efficient and accurate and we will recommend to do using canvas.
• In the below example, we have created an application using canvas. The application has background image, text and a button. When user will click on the button, he/she will be redirected to our website.

Code

In this code, we have imported webbrowser so that we can open the webpage. We have placed image in the background using canvas method create_image and then using create _text and create_window we have placed the button and text on the window.

from tkinter import *
import webbrowser

ws = Tk()
ws.title('PythonGuides')
ws.geometry('500x400')


new = 1
url = "https://www.pythonguides.com"

def openbrowser():
    webbrowser.open(url,new=new)

bg = PhotoImage(file = 'images/bg.png')

canvas = Canvas(
	ws, 
	width = 500,
	height = 400
	)

canvas.pack(fill='both', expand = True)

canvas.create_image(
	0, 
	0, 
	image=bg,
	anchor = "nw"
	)

canvas.create_text(
	250, 
	150, 
	text = 'PythonGuides',
	font=('Arial', 50),
	)

btn = Button(
	ws, 
	text = 'EXPLORE MORE',
	command=openbrowser,
	width=20,
	height=2,
	relief=SOLID,
	font=('arial', 18)
	)

btn_canvas = canvas.create_window(
	100, 
	200,
	anchor = "nw",
	window = btn,
	)


ws.mainloop()

Output

In this output, you can see that application has background image, text and button. When user will click on the button he/she will be redirected to a website.

Read: Python Tkinter Radiobutton – How to use

Python Tkinter Image Resize

In this section, we will learn how to resize the image in Python Tkinter.

• Using Pillow library in Python Tkinter we can resize the images. to import Pillow use this code from PIL import Image, ImageTk
• image.resize((w, h)) this command allows us to change the height(h) and width(w) of the image.
• In the below example, we have created an application in which the user can provide width and height and the image will change the size in real-time.

Code

In this code, we have used Image method from Pillow module to change the size of the image.

from tkinter import *
from PIL import Image, ImageTk

ws = Tk()
ws.title('PythonGuides')
ws.geometry('500x400')
ws.config(bg='#4a7a8c')


def resize_func():
    image = Image.open("images/sasuke.png")
    w = int(width.get())
    h = int(height.get())
    resize_img = image.resize((w, h))
    img = ImageTk.PhotoImage(resize_img)
    disp_img.config(image=img)
    disp_img.image = img


frame = Frame(ws)
frame.pack()

Label(
    frame,
    text='Width'
    ).pack(side=LEFT)
width = Entry(frame, width=10)
width.insert(END, 300)
width.pack(side=LEFT)

Label(
    frame,
    text='Height'
    ).pack(side=LEFT)

height = Entry(frame, width=10)
height.insert(END, 350)
height.pack(side=LEFT)

resize_btn = Button(
    frame,
    text='Resize',
    command=resize_func
)
resize_btn.pack(side=LEFT)

disp_img = Label()
disp_img.pack(pady=20)


ws.mainloop()

Output

In this output, you can see that image is resizing as per the height and width provided by the user. The is a full fledged application created in Python Tkinter that can be used for daily activities.

Read: Python Tkinter Button – How to use

Python Tkinter Image Size

In this section, we will learn how to get the image size in Python Tkinter.

• first thing in the process is to import Image, ImageTk from PIL.
• then ImageTk provides width and height method using which we can get the size of an image.

Code

In this code, text=f'width: {img.width()} height: {img.height()}' this command displays the height and width of the image. Here, img is the variable that stores the file file.

from tkinter import *  
from PIL import ImageTk,Image  

ws = Tk()  
ws.title('PythonGuides')
ws.geometry('500x500')

canvas = Canvas(
        ws, 
        width = 500, 
        height = 400
        )  
canvas.pack()  
img = ImageTk.PhotoImage(Image.open('images/workstation.jpg'))  

canvas.create_image(
        10, 
        10, 
        anchor=NW, 
        image=img
        ) 
Label(
    ws,
    text=f'width: {img.width()} height: {img.height()}'
).pack()

ws.mainloop() 

Output

In this output, you can see that height and width of the image is displayed at the bottom of the page.

Read: Create a Snake Game in Python Tkinter

Python Tkinter Image Label

In this section, we will learn how to set image on the Label widget in Python Tkinter.

• The label widget in Python Tkinter is used to display text and images on the application window.
• The label widget has a property image. Adding an image file to this property will set the image on the label widget.
• If you are dealing with PNG images then you can simply use the PhotoImage method which is a built-in method in Python Tkinter.
• For advanced features and all extensions, use the Image, ImageTk in pillow library.

Code

Here is the simple code to display image using Label widget in Python Tkinter.

from tkinter import *

ws = Tk()
ws.title('PythonGuides')


img = PhotoImage(file='images/sasuke.png')
Label(
    ws,
    image=img
).pack()

ws.mainloop()

Output

Read: How to Take User Input and Store in Variable using Python Tkinter

Python Tkinter Image Doesn’t Exist

This is a common error that is encountered by almost all the programmers working with images in Python Tkinter that says, Python Tkinter Image Doesn’t Exist.

• There are mainly three reasons for this error:
  • image path provided is incorrect
  • You have read the image using var = Image.open(pathToImage) but you have not passed it to ImageTk.PhotoImage(var).
  • declare a global variable in case you are trying image in function.
• _tkinter.TclError: couldn’t recognize data in image file “images/workstation.jpg”
• If you are seeing the above error code, that means you are trying to use a JPG image file using PhotoImage.
• To fix that either use a PNG image file or switch to Pillow. As Pillow module allows the use of various image extensions.

You may like the following Python tkinter tutorials:

• Python Tkinter Frame
• Python Tkinter TreeView – How to Use
• Python Tkinter ToDo List
• Python Tkinter Window Size
• Python Tkinter Canvas Tutorial
• Python Tkinter Table Tutorial
• Create Word Document in Python Tkinter

In this tutorial, we have learned how to add images in Python Tkinter. Also, we have covered these topics.

• Python Tkinter Image
• Python Tkinter Image Display
• Python Tkinter Image Button
• Python Tkinter Image Background
• Python Tkinter Image Resize
• Python Tkinter Image Size
• Python Tkinter Image Label
• Python Tkinter Image Doesn’t Exist