How to get rid of widget border? - python

I have the following code:
from Tkinter import *
def gui():
root = Tk()
root.configure(background = 'red')
rightPanel = PanedWindow(borderwidth=0, bg='black')
rightPanel.pack(side = 'right', fill=BOTH, expand=1)
canvas1 = Canvas(rightPanel, bg='black')
rightlabel = Label(canvas1, bg= 'grey')
rightlabel.place(relx=0.5, rely=0.5, anchor=CENTER)
canvas1.pack(fill=BOTH, expand=1)
root.wm_attributes('-topmost', 1)
mainloop()
if __name__ =='__main__':
gui()
As you can see if you run it (especially in fullscreen mode), there is grey border near window edge.
It looks like border of PanedWindow widget (you can see it, if you set its fill=NONE and expand window). Note that ts borderwidth is set to 0
How can I get rid of it or set it to some color?

What you are seeing is the highlight ring around the canvas -- something that changes color to show that the canvas has keyboard focus. Set it to zero with the highlightthickness attribute:
canvas1 = Canvas(rightPanel, bg='black', highlightthickness=0)
Note that it could also be the canvas border. You might want to set borderwidth to zero, too.

Related

Why isn't this frame in tkinter centered correctly?

I want this entry bar and other contents I'll add to the frame later to be centred correctly, I received this code that supposedly should work but it isn't.
import tkinter as tk
import math
import time
root = tk.Tk()
root.geometry()
root.attributes("-fullscreen", True)
exit_button = tk.Button(root, text = "Exit", command = root.destroy)
exit_button.place(x=1506, y=0)
frame = tk.Frame(root)
main_entry = tk.Entry(root, width = 100, fg = "black")
main_entry.place(x=50, y=50)
frame.place(relx=.5,rely=.5, anchor='center')
root.mainloop()
As you can see the frame isn't centred so how can I fix this?
In order to achieve widget centering on a fullscreen I've had to use grid manager.
The code below works but the exact positioning requires some fiddling with frame padding.
frame padx = w/2-300 and pady = h/2-45 are arbitrary values found using a bit of trial and error.
import tkinter as tk
root = tk.Tk()
root.attributes( '-fullscreen', True )
w, h = root.winfo_screenwidth(), root.winfo_screenheight()
frame = tk.Frame( root )
main_entry = tk.Entry( frame, width = 100 )
main_entry.grid( row = 0, column = 0, sticky = tk.NSEW )
frame.grid( row = 0, column = 0, padx = w/2-300, pady = h/2-45, sticky = tk.NSEW )
exit_button = tk.Button( frame, text = 'Exit', command = root.destroy )
exit_button.grid( row = 1, column = 0, sticky = tk.NSEW )
tk.mainloop()
Frame automatically changes size to size of objects inside Frame (when you use pack()) but you have nothing inside Frame. You put all widgets directly in root - so Frame has no size (width zero, height zero) and it is not visible.
When I use tk.Frame(root, bg='red', width=100, height=100) then I see small red frame in the center.
You have two problems:
(1) you put Entry in wrong parent - it has to be frame instead of root,
(2) you use place() which doesn't resize Frame to its children and it has size zero - so you don't see it. You would have to set size of Frame manully (ie. tk.Frame(..., width=100, height=100)) or you could use pack() and it will resize it automatically.
I add colors for backgrounds to see widgets. blue for window and red for frame.
import tkinter as tk
root = tk.Tk()
root['bg'] = 'blue'
root.attributes("-fullscreen", True)
exit_button = tk.Button(root, text="Exit", command=root.destroy)
exit_button.place(x=1506, y=0)
frame = tk.Frame(root, bg='red')
frame.place(relx=.5, rely=.5, anchor='center')
main_entry = tk.Entry(frame, width=100, fg="black")
main_entry.pack(padx=50, pady=50) # with external margins 50
root.mainloop()

How do I change the width of Tkinter widgets in smaller increments (Python)?

The left side of the box is aligned with the left side of some_label. I am unable to set the width so that the right side of some_label also aligns with the right side of the box because the increments between different width values are too large. A width of 35 puts the right end of some_label too far left and a width of 36 puts it too far right.
from tkinter import *
root = Tk()
root.geometry('500x500')
box = Frame(root, width=383, height=246, bg='black')
box.place(x=241, y=65, anchor=CENTER)
some_label = Label(root, text='Some Label', borderwidth=1, relief='solid')
some_label.place(x=50, y=210)
some_label.config(width=35, font=('TkDefaultFont', 15)) # whether width is 35 or 36, the label never aligns with the box
mainloop()
Since you use place(), you can specify the width directly:
import tkinter as tk
root = tk.Tk()
root.geometry('500x500')
box = tk.Frame(root, width=383, height=246, bg='black')
box.place(x=241, y=65, anchor='c')
some_label = tk.Label(root, text='Some Label', borderwidth=1, relief='solid')
some_label.place(x=241, y=210, width=383, anchor='c') # set width to same as 'box'
some_label.config(font=('TkDefaultFont', 15))
root.mainloop()
To set the width of a Label in pixels you have to include an image. Easiest would to use a transparent pixel and present it in the label with compound='center' which does not offset the text.
Alternatively you could simply use a containing frame to control the widget sizes.
I have included both ways in my example.
from tkinter import *
root = Tk()
root.geometry('500x500')
box = Frame(root, width=383, height=246, bg='black')
box.place(x=241, y=65, anchor=CENTER)
some_label = Label(root, text='Some Label', borderwidth=1, relief='solid')
some_label.place(x=50, y=210)
img = PhotoImage(file='images/pixel.gif') # Create image
some_label.config(image=img, compound='center') # Set image in label
some_label.config(width=379, font=('TkDefaultFont', 15)) # Size in pixels
# Alternateivly control size by an containing widget:
container = Frame(root, bg='tan') # Let frame adjust to contained widgets
container.place(x=241, y=360, anchor=CENTER)
# Let the contained widget set width
other_box = Frame(container, height=100, width=383, bg='black') # Set width
other_box.pack()
other_label = Label(container, text='Some Label', borderwidth=1, relief='solid')
other_label.pack(expand=True, fill=X, pady=(20,0)) # Expand to fill container
other_label.config(font=('TkDefaultFont', 15))
mainloop()
If you are going to make complex GUI designs, grid() is almost always easier to use.

Python Tkinter - Put Vertical and Horizontal Scrollbar at the edge of the canvas

I want to put the horizontal and vertical scrollbars at the edge of the yellow canvas using Python tkinter, but whatever I do, it does not move and just stay inside the perimeter of the canvas. Why? Below is the image:
Below is the code:
def render_gui(self):
self.main_window = tk.Tk()
self.main_window.geometry("1000x600")
self.main_window.title("Damaged Text Document Virtual Restoration")
self.main_window.resizable(True, True)
self.main_window.configure(background="#d9d9d9")
self.main_window.configure(highlightbackground="#d9d9d9")
self.main_window.configure(highlightcolor="black")
self.main_canvas = tk.Canvas(self.main_window, bg = "yellow")
self.main_canvas.pack(expand = True, fill = "both")
vsb = tk.Scrollbar(self.main_canvas, orient="vertical", command=self.main_canvas.yview)
hsb = tk.Scrollbar(self.main_canvas, orient="horizontal", command=self.main_canvas.xview)
vsb.grid(row=1, column=50,columnspan = 20, sticky='ns')
hsb.grid(row=20, column=1,rowspan = 20,sticky = 'wes')
self.main_canvas.configure(yscrollcommand=vsb.set,xscrollcommand=hsb.set)
self.main_window.mainloop()
Please help.
The problem is that you are putting the scrollbars inside the canvas, and you've put nothing else in the canvas.
When you use grid to put something inside another widget, rows and columns that are empty have a size of zero. Thus, even though you put the vertical scrollbar in column 50, columns 0 and 2-49 have a width of zero so column 50 appears on the left. (Column 1 is the width of the horizontal scrollbar.)
The same is true for the horizontal scrollbar - you're putting it in row 20, but rows 0 and 2-19 have a height of zero, so row 20 appears near the top.
Normally it's not a good idea to put scrollbars inside the canvas, since anything you draw on the canvas might be hidden or partially hidden by the scrollbars. If you want them to appear to be in the canvas, the simplest solution is to put both the canvas and the scrollbars inside a frame. You can then turn the border off on the canvas and turn the border on for the frame.
Example:
import tkinter as tk
class Example():
def render_gui(self):
self.main_window = tk.Tk()
self.main_window.geometry("1000x600")
self.main_window.title("Damaged Text Document Virtual Restoration")
self.main_window.resizable(True, True)
self.main_window.configure(background="#d9d9d9")
self.main_window.configure(highlightbackground="#d9d9d9")
self.main_window.configure(highlightcolor="black")
canvas_container = tk.Frame(self.main_window, bd=1, relief='sunken')
canvas_container.pack(expand = True, fill = "both")
self.main_canvas = tk.Canvas(canvas_container, bg = "yellow")
vsb = tk.Scrollbar(canvas_container, orient="vertical", command=self.main_canvas.yview)
hsb = tk.Scrollbar(canvas_container, orient="horizontal", command=self.main_canvas.xview)
self.main_canvas.configure(yscrollcommand=vsb.set,xscrollcommand=hsb.set)
vsb.grid(row=0, column=1, sticky="ns")
hsb.grid(row=1, column=0, sticky="ew")
self.main_canvas.grid(row=0, column=0, sticky="nsew")
canvas_container.grid_rowconfigure(0, weight=1)
canvas_container.grid_columnconfigure(0, weight=1)
self.main_window.mainloop()
e = Example()
e.render_gui()
The code has the canvas as the parent to the scrollbars.
Setting the scrollbars to have the same parent as the canvas, and changing a few placement things around, renders something workable:
import tkinter as tk
class test:
def __init__(self):
self.render_gui()
def render_gui(self):
self.main_window = tk.Tk()
self.main_window.geometry("1000x600")
self.main_window.title("Damaged Text Document Virtual Restoration")
self.main_window.resizable(True, True)
self.main_window.configure(background="#d9d9d9")
self.main_window.configure(highlightbackground="#d9d9d9")
self.main_window.configure(highlightcolor="black")
self.main_canvas = tk.Canvas(self.main_window, bg = "yellow")
vsb = tk.Scrollbar(self.main_window, orient="vertical", command=self.main_canvas.yview)
hsb = tk.Scrollbar(self.main_window, orient="horizontal", command=self.main_canvas.xview)
hsb.pack(side = "bottom", fill = "x")
vsb.pack(side = "right", fill = "y")
self.main_canvas.pack(expand = True, fill = "both")
self.main_canvas.configure(yscrollcommand=vsb.set,xscrollcommand=hsb.set)
self.main_window.mainloop()
t = test()
from tkinter import *
from tkinter import scrolledtext
janela = Tk()
scroll_x = Scrollbar(janela, orient="horizontal")
text = scrolledtext.ScrolledText(janela, wrap=NONE)
text.config(xscrollcommand=scroll_x.set)
scroll_x.configure(command=text.xview)
text.pack(fill=X)
scroll_x.pack(fill=X)
janela.mainloop()

Tkinter's button can't change border color

Here's my Tkinter code:
Photoshop = Tkinter.Button(root,
text = 'Photoshop',
fg = '#37d3ff',
bg = '#001d26',
bd = 10,
highlightthickness=4,
highlightcolor="#37d3ff",
highlightbackground="#37d3ff",
borderwidth=4)
However, after I grid my Button, the color of border doesn't shows up. Instead, it used default grey.
You may place the button inside its own frame like this:
buttonborder = Tkinter.Frame(root,
highlightbackground="#37d3ff",
highlightcolor="#37d3ff",
highlightthickness=4,
bd=0)
photoshop = Tkinter.Button(buttonborder,
text='Photoshop',
fg='#37d3ff',
bg='#001d26')
This works for me:
import Tkinter as tk
root = tk.Tk()
Photoshop = tk.Button(root, text = 'Photoshop',
fg = '#37d3ff',
bg = '#001d26',
bd = 10,
highlightthickness=4,
highlightcolor="#37d3ff",
highlightbackground="#37d3ff",
borderwidth=4)
Photoshop.pack()
root.mainloop()
You can add your widget to a Frame and make the Frame's highlight background to be the color you want for your widget's border. CODE Example:
import tkinter as tk
root = tk.Tk()
buttonborder = tk.Frame(root, highlightbackground="#37d3ff",
highlightthickness=3, bd=0)
photoshop = tk.Button(buttonborder, text='Photoshop', fg='#37d3ff')
photoshop.pack()
buttonborder.pack()
root.mainloop()
You can do it with LabelFrame() and relief.
Works in windows.
from tkinter import *
App = Tk()
Border = LabelFrame(App,
bd=5, #<- Borderwidth.
bg="blue", #<- Border color.
relief=FLAT)
Border.pack(padx=10, pady=10)
Btn1 = Button(Border, #<- in Border Widget.
text="Button",
font="Arial 16 bold",
width=16,
bg="red",
fg="white",
relief=FLAT)
Btn1.pack()
App.mainloop()
There is no perfect way to do this unfortunately, But you sure can hack around and place a tkinter Frame that is just a little bigger than the actual button to set them apart by using the frame as a coloured border, Something like this. Should work on Win and Mac or any other OS's..
(assuming you already know how to work with tkinter root window..)
`borderFrame = Frame(root, bg="red(your desired colour of choice)")
borderFrame.pack(padx=21, pady=21)
button = Button(borderFrame, bg="blue",text="click me", relief='flat')
button.pack(padx=20, pady=20)`

How to set border color of certain Tkinter widgets?

I'm trying to change the background color of my Tkinter app, but for certain widgets it leaves a white border around the edges.
For example, this:
from tkinter import *
COLOR = "black"
root = Tk()
root.config(bg=COLOR)
button = Button(text="button", bg=COLOR)
button.pack(padx=5, pady=5)
entry = Entry(bg=COLOR, fg='white')
entry.pack(padx=5, pady=5)
text = Text(bg=COLOR, fg='white')
text.pack(padx=5, pady=5)
root.mainloop()
How can I set border colour of certain Tkinter widgets?
Just use
widget.config(highlightbackground=COLOR)
Furthermore, if you don't want that border at all, set the highlightthickness attribute to 0 (zero).
You have to set the two highlights (with and without focus) to have a continuous color.
from tkinter import *
root = Tk()
e = Entry(highlightthickness=2)
e.config(highlightbackground = "red", highlightcolor= "red")
e.pack()
root.mainloop()

Categories

Resources