Page 1 of 1

How to display an image using tkinter in gui

Posted: Thu Jan 10, 2019 6:56 am
by vajra11
this is code to display image on screen with tkinter

Code: Select all

from tkinter import *

# pip install pillow
from PIL import Image, ImageTk

class Window(Frame):
    def __init__(self, master=None):
        Frame.__init__(self, master)
        self.master = master
        self.pack(fill=BOTH, expand=1)
        
        load = Image.open("parrot.jpg")
        render = ImageTk.PhotoImage(load)
        img = Label(self, image=render)
        img.image = render
        img.place(x=0, y=0)

        
root = Tk()
app = Window(root)
root.wm_title("Tkinter window")
root.geometry("200x120")
root.mainloop()
It's working with no issues

I am trying to modified code to display image in different row and cloumn

This is mine code to display image but I don't get image on screen

Code: Select all

import tkinter as tk

from PIL import Image, ImageTk

class MainApplication(tk.Frame):
   def __init__(self, master):
       self.master = master
       tk.Frame.__init__(self, self.master)
        
   def create_widgets(self):
       self.create_image()
       
   def create_image():
       load = Image.open("parrot.jpg")
       render = ImageTk.PhotoImage(load)
       img = Label(self, image=render)
       img.image = render
       img.place(x=0, y=0)

if __name__ == '__main__':
   root = tk.Tk()
   main_app =  MainApplication(root)
   root.mainloop()
        
What's the wrong in code ?

Re: How to display an image using tkinter in gui

Posted: Thu Jan 10, 2019 10:08 am
by scotty101
You aren't calling the create_widgets method so the code call create_image doesn't get called therefore the code to display the image doesn't get called.

If you put print statements in your code or run it though to tool with a debugger you will be able to debug these kind of things yourself.

Re: How to display an image using tkinter in gui

Posted: Thu Jan 10, 2019 11:32 am
by vajra11
scotty101 wrote:
Thu Jan 10, 2019 10:08 am
You aren't calling the create_widgets method so the code call create_image doesn't get called therefore the code to display the image doesn't get called.

If you put print statements in your code or run it though to tool with a debugger you will be able to debug these kind of things yourself.
I added print statement in function. and I am calling create_image(self)

Code: Select all

import tkinter as tk

from PIL import Image, ImageTk

class MainApplication(tk.Frame):
   def __init__(self, master):
       self.master = master
       tk.Frame.__init__(self, self.master)
        
   def create_widgets(self):
       self.create_image()
       
   def create_image(self):
       print ("image")
       load = Image.open("parrot.jpg")
       render = ImageTk.PhotoImage(load)
       img = Label(self, image=render)
       img.image = render
       img.place(x=0, y=0)
  
if __name__ == '__main__':
   root = tk.Tk()
   main_app =  MainApplication(root)
   root.mainloop()

Re: How to display an image using tkinter in gui

Posted: Thu Jan 10, 2019 11:44 am
by Paeryn
You are calling create_image() from within create_widgets() but nowhere are you calling create_widgets() so neither will be run.

Re: How to display an image using tkinter in gui

Posted: Thu Jan 10, 2019 11:58 am
by vajra11
Paeryn wrote:
Thu Jan 10, 2019 11:44 am
You are calling create_image() from within create_widgets() but nowhere are you calling create_widgets() so neither will be run.
I understand it
What you said, I am doing here

Code: Select all

import tkinter as tk

def function(Frame):
    label = tk.Label(Frame, text="Hello")
    label.pack(padx=20, pady=20)
    return

if __name__ == "__main__":
    root = tk.Tk()
    function(root)
    root.mainloop()

Re: How to display an image using tkinter in gui

Posted: Thu Jan 10, 2019 12:29 pm
by scotty101
vajra11 wrote:
Thu Jan 10, 2019 11:58 am
I understand it
What you said, I am doing here
If you were calling it, it would be working...

Post your latest code attempt.

Re: How to display an image using tkinter in gui

Posted: Thu Jan 10, 2019 12:43 pm
by vajra11
scotty101 wrote:
Thu Jan 10, 2019 12:29 pm
vajra11 wrote:
Thu Jan 10, 2019 11:58 am
I understand it
What you said, I am doing here
If you were calling it, it would be working...

Post your latest code attempt.
please see my code in previous post. I don't know where I am making mistake

Re: How to display an image using tkinter in gui

Posted: Thu Jan 10, 2019 1:20 pm
by scotty101
vajra11 wrote:
Thu Jan 10, 2019 12:43 pm
please see my code in previous post. I don't know where I am making mistake
If you mean this code. Then it is wrong

Code: Select all

import tkinter as tk

from PIL import Image, ImageTk

class MainApplication(tk.Frame):
   def __init__(self, master):
       self.master = master
       tk.Frame.__init__(self, self.master)
        
   def create_widgets(self):
       self.create_image()
       
   def create_image(self):
       print ("image")
       load = Image.open("parrot.jpg")
       render = ImageTk.PhotoImage(load)
       img = Label(self, image=render)
       img.image = render
       img.place(x=0, y=0)
  
if __name__ == '__main__':
   root = tk.Tk()
   main_app =  MainApplication(root)
   root.mainloop()
Try this instead

Code: Select all

import tkinter as tk

from PIL import Image, ImageTk

class MainApplication(tk.Frame):
   def __init__(self, master):
       self.master = master
       tk.Frame.__init__(self, self.master)
       #NEW LINE BELOW!!! - Call to create_widgets
       self.create_widgets()
        
   def create_widgets(self):
       self.create_image()
       
   def create_image(self):
       print ("image")
       load = Image.open("parrot.jpg")
       render = ImageTk.PhotoImage(load)
       img = Label(self, image=render)
       img.image = render
       img.place(x=0, y=0)
  
if __name__ == '__main__':
   root = tk.Tk()
   main_app =  MainApplication(root)
   root.mainloop()

Re: How to display an image using tkinter in gui

Posted: Sat Jan 12, 2019 5:00 am
by vajra11
scotty101 wrote:
Thu Jan 10, 2019 1:20 pm
vajra11 wrote:
Thu Jan 10, 2019 12:43 pm
please see my code in previous post. I don't know where I am making mistake
Try this instead

Code: Select all

import tkinter as tk

from PIL import Image, ImageTk

class MainApplication(tk.Frame):
   def __init__(self, master):
       self.master = master
       tk.Frame.__init__(self, self.master)
       #NEW LINE BELOW!!! - Call to create_widgets
       self.create_widgets()
        
   def create_widgets(self):
       self.create_image()
       
   def create_image(self):
       print ("image")
       load = Image.open("parrot.jpg")
       render = ImageTk.PhotoImage(load)
       img = Label(self, image=render)
       img.image = render
       img.place(x=0, y=0)
  
if __name__ == '__main__':
   root = tk.Tk()
   main_app =  MainApplication(root)
   root.mainloop()
I tried this
img = Label(self, image=render)
NameError: name 'Label' is not defined

I have modified it

Code: Select all

import tkinter as tk

from PIL import Image, ImageTk

class MainApplication(tk.Frame):
   def __init__(self, master):
       self.master = master
       tk.Frame.__init__(self, self.master)
       #NEW LINE BELOW!!! - Call to create_widgets
       self.create_widgets()
        
   def create_widgets(self):
       self.create_image()
       
   def create_image(self):
       print ("image")
       load = Image.open("image.jpg")
       render = ImageTk.PhotoImage(load)
       img = tk.Label(self, image=render)
       img.image = render
       img.place(x=0, y=0)
  
if __name__ == '__main__':
   root = tk.Tk()
   main_app =  MainApplication(root)
   root.mainloop()
It print image but doesn't show any image ?

Re: How to display an image using tkinter in gui

Posted: Sat Jan 12, 2019 5:13 pm
by scotty101
Ah! One of those tkinter gotchas! You need to make the images class properties otherwise they are destroyed when the function is finished. Adding self. in front of them does the job. See below

Code: Select all

import tkinter as tk

from PIL import Image, ImageTk

class MainApplication(tk.Frame):
   def __init__(self, master):
       self.master = master
       tk.Frame.__init__(self, self.master)
       self.create_widgets()
        
   def create_widgets(self):
       self.create_image()
       
   def create_image(self):
       self.image = Image.open("image.jpg")
       self.photo = ImageTk.PhotoImage(self.image)
       self.img = tk.Label(self,text="Hello",image=self.photo)
       self.img.grid()

  if __name__ == '__main__':
   root = tk.Tk()
   main_app =  MainApplication(root)
   main_app.grid()
   root.mainloop()

Re: How to display an image using tkinter in gui

Posted: Sun Jan 13, 2019 9:10 am
by vajra11
scotty101 wrote:
Sat Jan 12, 2019 5:13 pm
Ah! One of those tkinter gotchas! You need to make the images class properties otherwise they are destroyed when the function is finished. Adding self. in front of them does the job. See below
Than you scotty

How to set image in frame

label should be in right side and logo (image)should be left side in the frame

Code: Select all

import tkinter as tk

from PIL import Image, ImageTk

class MainApplication(tk.Frame):
   def __init__(self, master):
       self.master = master
       tk.Frame.__init__(self, self.master)
       self.configure_gui()
       self.create_widgets()

   def configure_gui(self):
       self.master.title('Layout')
       self.master.geometry('1000x1000')
       self.master.resizable(0, 0)

   def create_widgets(self):
       self.create_frames()
       self.create_image()
       self.create_labels()
       
   def create_image(self):
       self.image = Image.open("image.jpg")
       self.photo = ImageTk.PhotoImage(self.image)
       self.img = tk.Label(self,text="image",image=self.photo)
       self.img.grid(padx=350, pady=0)
       
   def create_frames(self):
       self.Frame11 = tk.Frame(width=500, height=50)
       self.Frame11.grid_propagate(0)
       self.Frame11.grid(row=0, column=0)
        
       self.Frame12 = tk.Frame(width=510, height=150)
       self.Frame12.grid_propagate(0)
       self.Frame12.grid(row=1, column=0, pady = 100)
       
       
   def create_labels(self):
      L1 = tk.Label(self.Frame11, text=" Hospital")
      L1.place(x=180, y=30)

if __name__ == '__main__':
   root = tk.Tk()
   main_app =  MainApplication(root)
   main_app.grid()
   root.mainloop()

Re: How to display an image using tkinter in gui

Posted: Mon Jan 14, 2019 1:11 pm
by scotty101
Read the tkinter documation or the ever useful effbot tkinterbook.

http://effbot.org/tkinterbook/label.htm

I suspect you want to set the "compound" option to either LEFT or RIGHT.

Re: How to display an image using tkinter in gui

Posted: Tue Jan 15, 2019 7:27 am
by vajra11
scotty101 wrote:
Mon Jan 14, 2019 1:11 pm
Read the tkinter documation or the ever useful effbot tkinterbook.

http://effbot.org/tkinterbook/label.htm

I suspect you want to set the "compound" option to either LEFT or RIGHT.
my label is it in Frame1 but image is not in the Frame1

Code: Select all

import tkinter as tk

from PIL import Image, ImageTk

class MainApplication(tk.Frame):
   def __init__(self, master):
       self.master = master
       tk.Frame.__init__(self, self.master)
       self.configure_gui()
       self.create_widgets()

   def configure_gui(self):
       self.master.title('image')
       self.master.geometry('600x500')
       self.master.resizable(0, 0)

   def create_widgets(self):
       self.create_frames()
       self.create_image()
       self.create_labels()
       
   def create_image(self):
       self.image = Image.open("image3.jpg")
       self.photo = ImageTk.PhotoImage(self.image)
       self.img = tk.Label(self,text="image",image=self.photo)
       self.img.grid(padx=350, pady=0)
       
   def create_frames(self):
       self.Frame1 = tk.Frame(width=500, height=50)
       self.Frame1.grid_propagate(0)
       self.Frame1.grid(row=0, column=0)
       
       
   def create_labels(self):
      L1 = tk.Label(self.Frame1, text=" Hospital")
      L1.place(x=0, y=20)

if __name__ == '__main__':
   root = tk.Tk()
   main_app =  MainApplication(root)
   main_app.grid()
   root.mainloop()
I think, I have to change this function

Code: Select all

   def create_image(self):
       self.image = Image.open("image3.jpg")
       self.photo = ImageTk.PhotoImage(self.image)
       self.img = tk.Label(self,text="image",image=self.photo)
       self.img.grid(padx=350, pady=0)
How to set image in one frame [Frame1]

Re: How to display an image using tkinter in gui

Posted: Tue Jan 15, 2019 10:24 am
by scotty101
It's pretty simple.

Try taking some time to understand the code that you have already written rather than just copy and pasting.

This line, tells tk that the label containing the image's parent widget is "self", the "MainApplication" Frame

Code: Select all

self.img = tk.Label(self,text="image",image=self.photo)
Were you to change the code to

Code: Select all

self.img = tk.Label(self.Frame1,text="image",image=self.photo)
what do you think that would change the label's parent widget to?