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?
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)
# ^^^^^^^
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()
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?
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)
# ^^^^^^^
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()