In this video I’ll show you how to dynamically resize your background image whenever the app gets resized by a user.

In the last video I showed you how to add images as your background. In this video I’ll show you how to resize those images any time someone resizes the app. We’ll use the Pillow library to do this automatically using a Configure binding.

It’s actually pretty easy!

Python Code: image_bg_resize.py
(Github Code)

from tkinter import *
from PIL import ImageTk, Image

root = Tk()
root.title('Codemy.com - Set Image as Background')
root.iconbitmap('c:/gui/codemy.ico')
root.geometry("800x500")

# Define image
bg = ImageTk.PhotoImage(file="images/mario.png")

# Create a canvas
my_canvas = Canvas(root, width=800, height=500)
my_canvas.pack(fill="both", expand=True)

# Set image in canvas
my_canvas.create_image(0,0, image=bg, anchor="nw")

# Add a label
my_canvas.create_text(400, 250, text="Welcome!", font=("Helvetica", 50), fill="white")

# add some buttons
button1 = Button(root, text="Start")
button2 = Button(root, text="Reset Scores")
button3 = Button(root, text="Exit")

button1_window = my_canvas.create_window(10, 10, anchor="nw", window=button1)
button2_window = my_canvas.create_window(100, 10, anchor="nw", window=button2)
button3_window = my_canvas.create_window(230, 10, anchor="nw", window=button3)

def resizer(e):
	#global bg1, resized_bg, new_bg
	# Open our image
	bg1 = Image.open("images/mario.png")
	# Resize the image
	resized_bg = bg1.resize((e.width, e.height), Image.ANTIALIAS)
	# Define our image again
	new_bg = ImageTk.PhotoImage(resized_bg)
	# Add it back to the canvas
	my_canvas.create_image(0,0, image=new_bg, anchor="nw")
	# Readd the text
	my_canvas.create_text(400, 250, text="Welcome!", font=("Helvetica", 50), fill="white")

'''
# Create a label
my_label = Label(root, image=bg)
my_label.place(x=0, y=0, relwidth=1, relheight=1)

# Add something to the top of our image
my_text = Label(root, text="Welcome!", font=("Helvetica", 50), fg="white", bg="#2a1863")
my_text.pack(pady=50)

# create a frame
my_frame = Frame(root, bg='#6b88fe')
my_frame.pack(pady=20)

# Add some buttons
my_button1 = Button(my_frame, text="Exit")
my_button1.grid(row=0, column=0, padx=20)

my_button2 = Button(my_frame, text="Start")
my_button2.grid(row=0, column=1, padx=20)

my_button3 = Button(my_frame, text="Reset")
my_button3.grid(row=0, column=2, padx=20)
'''
root.bind('', resizer)

root.mainloop()

John Elder

John is the CEO of Codemy.com where he teaches over 100,000 students how to code! He founded one of the Internet's earliest advertising networks and sold it to a publicly company at the height of the first dot com boom. After that he developed the award-winning Submission-Spider search engine submission software that's been used by over 3 million individuals, businesses, and governments in over 42 countries. He's written several Amazon #1 best selling books on coding, and runs a popular Youtube coding channel.

View all posts

Add comment

Your email address will not be published. Required fields are marked *

John Elder

John is the CEO of Codemy.com where he teaches over 100,000 students how to code! He founded one of the Internet's earliest advertising networks and sold it to a publicly company at the height of...