Python Forum
Display image in tkinter - Printable Version

+- Python Forum (https://python-forum.io)
+-- Forum: Python Coding (https://python-forum.io/forum-7.html)
+--- Forum: GUI (https://python-forum.io/forum-10.html)
+--- Thread: Display image in tkinter (/thread-14410.html)

Display image in tkinter - dan789 - Nov-28-2018

Hi all, I have a problem with displaying my image in tkinter. I´m creating a class, which creates a canvas and put an image from my file there. This is my code so far:

class Try:

    ... creating a canvas ...

    def method(self):
        player_icon = tkinter.PhotoImage(file="C://Users//name//Documents//PYTHON//folder//img_player.png")
        self.canvas.create_image(50, 50, image=player_icon)
It doesn´t reach any error, it seems like it found that image but simply doesn´t show it. What am I doing wrong?

Thanks in advance.

RE: Display image in tkinter - Larz60+ - Nov-28-2018

here's a sample:
icon source: https://www.opensecurityarchitecture.org/cms/library/icon-library

from tkinter import *

def show_image():
    root = Tk()

    canvas = Canvas(root,  width=400, height=400)
    canvas.pack()

    img = PhotoImage(file="osa_lightning.png")
    canvas.create_image(10, 10, anchor=NW, image=img)

    mainloop()

if __name__ == '__main__':
    show_image()
[attachment=499]

RE: Display image in tkinter - woooee - Nov-28-2018

You possibly need an ImageTk.PhotoImage. see http://effbot.org/tkinterbook/photoimage.htm Also, you have to import Image and ImageTk to have access to it's functions.

RE: Display image in tkinter - jfong - Nov-30-2018

player_icon --> self.player_icon

RE: Display image in tkinter - dan789 - Dec-01-2018

Thank you guys, I did it but now I noticed one another problem. I want to display my picture on canvas, where currently are some rectangles, lines and other graphics. I want to have this picture on the top of all graphics there, but it doesn´t appear so. It is probably behind, because I cannot see it. Can you help me with this?

RE: Display image in tkinter - Gribouillis - Dec-01-2018

Quote: It is probably behind, because I cannot see it
I would try 
item = canvas.create_image(10, 10, anchor=NW, image=img)
canvas.tag_raise(item)


RE: Display image in tkinter - jfong - Dec-02-2018

By default, the "display list" of the objects on the canvas follows their creation sequence, from the bottom (the first created one) to the top (the last one). You can change it through the object's ID or tag.

RE: Display image in tkinter - dan789 - Dec-09-2018

Ok so this seems working, but now I want to implement this image displaying feature into my for cycle. It should look like this:

for i in range(self.height // self.field_size):
            for j in range(self.width // self.field_size):
                self.field_icon = tkinter.PhotoImage(file="GroundGravel_Grass.png")
                if self.layout[field] == "0":
                    self.canvas.create_image(j*50, i*50, anchor=NW, image=self.field_icon)
                elif self.layout[field] == "1":
                    self.canvas.create_rectangle(j*50, i*50, j*50+self.field_size, i*50+self.field_size, fill="blue", outline="yellow")
                elif self.layout[field] == "2":
                    self.canvas.create_rectangle(j*50, i*50, j*50+self.field_size, i*50+self.field_size, fill=self.sand, outline="yellow")
Basically, this program reads a file with number 0, 1 and 2 and according to specific numbers it should put an image to the correct position (according to "i" and "j") and so create a square grid (should work as a playfield later). You can see that in case of numbers 1 and 2 I have just colors yet, I stopped there, because even number 0 didn´t work with a picture of a grass. It draws just a last square, image here:

[Image: screen.png]

The whole black area should be covered with such a green grass tiles, but when I replace image of a grass by basic green color tile, it works. Can you help me?

RE: Display image in tkinter - Gribouillis - Dec-09-2018

Move line 3 before the for loops. By overwriting self.field_icon in the loop you create many PhotoImage instances and destroy them at the next iteration. It seems to me that you need only one PhotoImage instance.

RE: Display image in tkinter - dan789 - Dec-09-2018

Woohoo.. :D works now, thanks a lot!