CODEWITHSUNDEEP
pythonimagebuttontkinter
Soundwave
Soundwave

Reputation: 625

Tkinter button with Image has borders

EDIT

I am using pictures as buttons. The 3rd image is the "Start" button and the 4th image is the "Numpad" button.

The buttons take more space than the image does, as you can see in the first image. I would like to take away that space so only the image space is taken.

I would like to get rid of the space, that the borders take, because I want the buttons to only take the space of the image size.

First image has this line of code in the MainButton class:

self.configure(bg=color['background'], activebackground=color['background'], borderwidth=0, highlightthickness=0)

Second image has this line of code in the MainButton class:

self.configure(bg=color['background'], activebackground=color['background'])

Full code:

class MainButton(Button):
    def __init__(self, *args, **kwargs):
        Button.__init__(self, *args, **kwargs)

        self.helv20 = Font(root= self,family="Arial",size=18)
        self.helv18 = Font(root= self,family="Arial",size=16)   

        self.configure(bg=color['background'], activebackground=color['background'], borderwidth=0, highlightthickness=0)   
    def _active(self, event):
        self.configure(image=self.ActiveImage)

    def _inactive(self, event):
        self.configure(image=self.DefaultImage)

class RunButton(MainButton):
    def __init__(self, *args, **kwargs):
        MainButton.__init__(self, *args, **kwargs)

        self.bind("<ButtonPress>", self._active)
        self.bind("<ButtonRelease>", self._inactive)

        self.DefaultImage=PhotoImage(file="img/mainbutton_green.png")
        self.ActiveImage=PhotoImage(file="img/mainbutton_active.png")   

        self.configure(image=self.DefaultImage, compound=CENTER, font=self.helv20)

enter image description here

enter image description here

enter image description here

enter image description here

Upvotes: 1

Views: 4069

Answers (1)

j_4321
j_4321

Reputation: 16169

borderwidth=0 just remove the border (which give the impression of relief, so it has the same effect has doing relief='flat'), but does not reduce the space around the image. To do that, you can use the padx and pady options of the button:

self.configure(bg=color['background'], activebackground=color['background'], 
               borderwidth=0, highlightthickness=0, padx=0, pady=0)

Upvotes: 2

Related Questions