简体   繁体   中英

How to add Image on the button without text in tkinter?

Recently I made a calculator in tkinter, in it i created a menu like thing on the left corner of the calculator. Inside the menu i created 2 buttons named as "Light Mode" and "Dark Mode". I wanted to add an image on the button " Dark Mode " instead of the text "Dark Mode". But when I replace the text with image, the button doesn't show the image on the button instead it shows something called "pyimage3"

this is what the image was created and assigned like:

self.darkmode_img= PhotoImage(file="c:/Users/sheran/Downloads/Dark_Mode.png")

i want this darkmode_img to be on the button instead of the text.

here is the full code:

       f1=Frame(self.window,width=170,height=100,bg='#fff',borderwidth=0,bd=0)
       f1.place(x=0,y=0)

       # Buttons
       def bttn(x,y,text,cmd):
          def on_entera(event):
            myButton1['background'] = '#F0F0F0' #ffcc66
            myButton1['foreground']= '#262626'  #000d33

          def on_leavea(event):
            myButton1['background'] = "#fff"
            myButton1['foreground']= '#000'

          myButton1 = Button(f1,text=self.darkmode_img,
                       width=42,
                       height=2,
                       fg='#000',
                       border=0,
                       bg="#fff",
                       borderwidth=0,
                       activeforeground='#262626',
                       activebackground="#F0F0F0",            
                       command=cmd)
                      
          myButton1.bind("<Enter>", on_entera)
          myButton1.bind("<Leave>", on_leavea)

          myButton1.place(x=-65,y=32)
         
       bttn(x=0,y=4,text=self.darkmode_img,cmd=self.darkmode_on)

       def bttn2(x,y,text,cmd):
          def on_entera(event):
            myButton1['background'] = '#F0F0F0' #ffcc66
            myButton1['foreground']= '#262626'  #000d33

          def on_leavea(event):
            myButton1['background'] = "#fff"
            myButton1['foreground']= '#000'

          myButton1 = Button(f1,text=text,
                       width=42,
                       height=2,
                       fg='#000',
                       border=0,
                       bg="#fff",
                       activeforeground='#262626',
                       activebackground="#F0F0F0",            
                       command=cmd)
                      
          myButton1.bind("<Enter>", on_entera)
          myButton1.bind("<Leave>", on_leavea)

          myButton1.place(x=-63,y=64)
       bttn2(x=0,y=4,text="Light Mode",cmd=self.lightmode_on)


       #
       def dele():
          f1.destroy()
        
       global img2
       img2 = ImageTk.PhotoImage(Image.open("c:/Users/sheran/Downloads/toggle_win/close1111.png"))

       MB=Button(f1,
           image=img2,
           border=0,
           command=dele,
           bg='#fff',
           activebackground='#fff').place(x=5,y=1)
    def img1(self):
     img1 = ImageTk.PhotoImage(Image.open("c:/Users/sheran/Downloads/toggle_win/open1111.png"))
    
    def Button(self):
    
     Button(self.window,image=self.img1,
       command=self.toggle_win,
       bd=0,
       borderwidth=0,
       bg='#f0f0f0',
       activebackground='#fff').place(x=5,y=1)

here is what I'm getting as the result:

in that result above, the place where it has "pyimage3", I need to place the image (self.darkmode_img) there on that button.

please help me:!! I'm def.netely a newbie :)

The reason the button says "pyimage3" is because that's what you get when you convert an instance of PhotoImage to a string. The image is being converted to a string because you're passing the image to the text parameter. The text parameter requires a string.

To add an image to a Button , set the image attribute:

Button(f1,image=self.darkmode_img, ...)

To add images to buttons you need to write the following code (it is an example):

from tkinter import *

root = Tk()

img = PhotoImage(file='image.png')
mybtn = Button(root, image=img, bd=0, cursor='hand2)
mybtn.image = img
mybtn.pack()

root.mainloop()

Most of the times the mistake happens when you don't put the 3rd line or in the 1st line don't put the file option.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM