Embedding an Image in a Tkinter Canvas Widget using PIL
Tkinter is a python module that provides an easy-to-use interface to the Tk GUI toolkit. It is one of the most popular libraries for creating GUI applications and is used extensively in the development of desktop applications. In this article, we will discuss how to embed an image in a Tkinter canvas widget using PIL.
The PIL (Python Imaging Library) module
The Python Imaging Library (PIL) is a module that adds support for opening, manipulating, and saving many image file formats. It can be installed using pip, a package installer for Python, and provides a wide range of image processing capabilities.
To install PIL, open a terminal and enter the following command:
pip install Pillow
Creating a Tkinter canvas widget
Before we dive into embedding images, let’s first create a Tkinter canvas widget. The canvas widget allows you to draw and manipulate graphics in your application. Here’s a simple example that creates a canvas widget with a red rectangle.
import tkinter as tk
root = tk.Tk()
canvas = tk.Canvas(root, width=400, height=400)
canvas.pack()
canvas.create_rectangle(50, 50, 250, 250, fill="red")
root.mainloop()
Embedding an image in a Tkinter canvas widget
To embed an image in a Tkinter canvas widget, we first need to create a PIL image object. We can then use the ImageTk.PhotoImage
class to create a Tkinter-compatible image object, which can be displayed on the canvas.
Here’s an example that loads an image and displays it on the canvas. Note that we have to keep a reference to the PhotoImage
object to prevent it from being garbage collected.
import tkinter as tk
from PIL import ImageTk, Image
root = tk.Tk()
canvas = tk.Canvas(root, width=400, height=400)
canvas.pack()
image = Image.open("my_image.jpg")
photo = ImageTk.PhotoImage(image)
canvas.create_image(200, 200, image=photo)
root.mainloop()
In the above example, we created an instance of the Image
class by opening an image file named “my_image.jpg”. We then created a PhotoImage
object using the ImageTk.PhotoImage
constructor. Finally, we used the create_image
method of the canvas widget to embed the image on the canvas at coordinates (200, 200).
It’s important to keep a reference to the PhotoImage
object to prevent it from being garbage collected. If we don’t, the image will not be displayed on the canvas.
Resizing an image
Sometimes we may need to resize an image before embedding it on the canvas. PIL provides an easy way to do this using the Image.resize
method. Here’s an example that resizes an image to 200×200 pixels before embedding it on the canvas.
import tkinter as tk
from PIL import ImageTk, Image
root = tk.Tk()
canvas = tk.Canvas(root, width=400, height=400)
canvas.pack()
image = Image.open("my_image.jpg")
image = image.resize((200, 200))
photo = ImageTk.PhotoImage(image)
canvas.create_image(200, 200, image=photo)
root.mainloop()
In this example, we created an instance of the Image
class and then resized it to 200×200 pixels using the resize
method. We then created a PhotoImage
object from the resized image and embedded it on the canvas using the create_image
method.
Conclusion
In this article, we learned how to embed an image in a Tkinter canvas widget using PIL. We covered the basics of creating a canvas widget, loading an image using the PIL module, and creating a Tkinter-compatible image using the ImageTk.PhotoImage
class. We also saw how to resize an image before displaying it on the canvas. With these techniques, you can create rich, interactive GUI applications in Python.