Custom Tkinter Images

Question:

I’m trying to create a back button. I have an image called back-button.png in the folder img.

This is my code:

from tkinter import *
import customtkinter as ctk

root = Tk()

ctk.CTkLabel(root, 
  text = 'This is a label', 
  text_font =('Verdana', 17)).pack(side = LEFT, pady = 11)

img = PhotoImage(file="./img/back-button.png")
ctk.CTkButton(root, image = img).pack(side = LEFT)

root.mainloop()

When I run this code I get this error:

Traceback (most recent call last):
  File "c:UsersUserDesktopyoutube-audio-downloadertempCodeRunnerFile.py", line 11, in <module>
    ctk.CTkButton(root, image = img).pack(side = LEFT)
  File "C:UsersUserAppDataLocalProgramsPythonPython39libsite-packagescustomtkintercustomtkinter_button.py", line 102, in __init__
    self.draw()
  File "C:UsersUserAppDataLocalProgramsPythonPython39libsite-packagescustomtkintercustomtkinter_button.py", line 147, in draw
    self.canvas.configure(bg=CTkColorManager.single_color(self.bg_color, self.appearance_mode))
  File "C:UsersUserAppDataLocalProgramsPythonPython39libtkinter__init__.py", line 1646, in configure
    return self._configure('configure', cnf, kw)
  File "C:UsersUserAppDataLocalProgramsPythonPython39libtkinter__init__.py", line 1636, in _configure
    self.tk.call(_flatten((self._w, cmd)) + self._options(cnf))
_tkinter.TclError: unknown color name "."

So, why is this happening? And how can I display an image on a button?

Asked By: leech

||

Answers:

The problem is that the CtkButton widget doesn’t not accept parameters the same way as standard widgets. The first parameter to a CtkButton is the background color, but you’re passing the root window and the root window isn’t a valid color.

You need to explicitly assign the root window to the master argument.

ctk.CTkButton(master=root, image = img).pack(side = LEFT)
#             ^^^^^^^
Answered By: Bryan Oakley

You are getting error because you are using built-in image define method which is in Tkinter not in Customtkinter. Don’t confuse these two. If you want to use Customtkinter only use that because when you are making bigger projects than this, it will be a whole mess if you use these two together.

import customtkinter
from PIL import Image, ImageTk
    
window = customtkinter.CTk()
    
button_image = customtkinter.CTkImage(Image.open("assets/yourimage.png"), size=(26, 26))
    
image_button = customtkinter.CTkButton(master=window, text="Text will be gone if you don't use compound attribute",image=button_image)
image_button.pack()
    
window.mainloop()
Answered By: Zed Unknown
Categories: questions Tags: , ,
Answers are sorted by their score. The answer accepted by the question owner as the best is marked with
at the top-right corner.