Search code examples
pythonimagetkinterlistbox

displaying image in Tkinter whenever clicking an item from the listbox


This is my whole code for reference and I would like to know how I can display their own respective country pictures whenever I click a country on the listbox to the frame three because I do not know how to do that and I would like to learn also thank you, any insight would be much appreciated.

from tkinter import *
from turtle import position, right
root = Tk()

root.title("LT_DelosSantosCristianJay")
root.geometry("500x200")



#FRAMES
frame_1 = Frame(root)
frame_1.grid(row = 0, column = 0, columnspan = 2)
frame_2 = Frame(root)
frame_2.grid(row = 1, column = 0,pady=(0,20))
frame_3 = Frame(root)
frame_3.grid(row = 1, column = 1)

continents = {
    "Asia": ["Philippines", "Malaysia", "Taiwan", "Singapore", "Thailand", "India"],

    "Africa": ["Algeria", "Angola", "Egypt", "Cape Verde", "Liberia", "Kenya", "Morocco", "Nigeria"],

    "America": ["Venezuela", "Peru", "Jamaica", "United States", "Cuba", "Chile", "Argentina"],

    "Europe": ["Russia", "Germany", "United Kingdom", "Italy", "Ukraine", "France", "Belgium"]
}

# Frame One

var = StringVar()
var.set('Select')

Radiobutton(frame_1, text="Asia", font=("Times", 12, "bold"), fg="blue", variable=var, value='Asia', borderwidth=1,
            relief=SOLID, width=10, command=lambda: RadioSelected(var.get())).pack(side=LEFT)
Radiobutton(frame_1, text="Africa", font=("Times", 12, "bold"), fg="blue", variable=var, value="Africa", borderwidth=1,
            relief=SOLID, width=11, command=lambda: RadioSelected(var.get())).pack(side=LEFT)
Radiobutton(frame_1, text="America", font=("Times", 12, "bold"), fg="blue", variable=var, value="America", borderwidth=1,
            relief=SOLID, width=11, command=lambda: RadioSelected(var.get())).pack(side=LEFT)
Radiobutton(frame_1, text="Europe", font=("Times", 12, "bold"), fg="blue", variable=var, value="Europe", borderwidth=1,
            relief=SOLID, width=11, command=lambda: RadioSelected(var.get())).pack(side=LEFT)

# Frame Two

# Listbox and Scrollbar
flag_listbox = Listbox(frame_2, font=("Times",15,"bold"),width=15,height=7)
flag_listbox.pack(side=LEFT, fill=BOTH)

flag_scrollbar = Scrollbar(frame_2)
flag_scrollbar.pack(side=RIGHT, fill=BOTH)

flag_listbox.config(yscrollcommand=flag_scrollbar.set)

flag_scrollbar.config(command=flag_listbox.yview)


# Radio Button click
def RadioSelected(Value):
    flag_listbox.delete(0, END)
    list_values = continents[Value]
    for i in list_values:
        flag_listbox.insert(END, i)

#Frame Three

flagbox_Label = Label(frame_3,bg="white",width=35,height=9)
flagbox_Label.grid(sticky="we",pady=(0,20))


root.mainloop()

Solution

  • Best way to display an image in tkinter is using pillow module :

    from tkinter import *
    from PIL import Image, ImageTk
    
    #U can assign this function to the command of every button
    #and pass the image path and the window or the frame as arguments.
    
    def show_img(image_path, frame) :
        width = 500
        height = 500
        image = Image.open(image_path)
        image = image.resize((width, height), Image.LANCZOS)
        #a 500x500 image (modify width and height vars depending on your needs)
        my_img0 = ImageTk.PhotoImage(image)
        initimg = Label(frame, image = my_img0)
        initimg.image = my_img0
        initimg.pack()
    

    to install pillow module use : pip install pillow (as easy as it seems ;))

    I hope that helps !