So i have some tkinter checkboxes in a frame widget, which should be aligned to each other. I thought with grid and then using sticky='w' should align them to most east as possible of the column. So to say, to have the checkbox-squares aligned. Instead this happens (the relief is just to see the boundaries of the checkbutton widgets):
Image of GUI
The documentation of the widget - in my opinion - does not provide a function to set this. With the sticky of grid i am not sure whether it should even be the function. Actually the relief shows its sticky in that column...
Here is my code example:
def init_checkboxes(self):
"""
Creates all checkboxes for this particular frame subclass.
"""
self.bvar_cbx_showplots = tk.BooleanVar(value=False)
self.cbx_showplots = tk.Checkbutton(self.lblframe, width=20,
text='Show Plots after run',
variable=self.bvar_cbx_showplots,
relief='groove')
self.cbx_showplots.grid(row=1, column=2, sticky='W')
self.bvar_cbx_saveres = tk.BooleanVar(value=True)
self.cbx_saveres = tk.Checkbutton(self.lblframe, width=20,
text='Save simulation results',
variable=self.bvar_cbx_saveres,
relief='groove')
self.cbx_saveres.grid(row=2, column=2, sticky='W')
edit: Second attempt from Reblochon
Use anchor.
anchor=
Controls where in the button the text (or image) should be located. Use one of N, NE, E, SE, S, SW, W, NW, or CENTER. Default is CENTER. If you change this, it is probably a good idea to add some padding as well, using the padx and/or pady options. (anchor/Anchor)
import tkinter as tk
root = tk.Tk()
bvar_cbx_showplots = tk.BooleanVar(value=False)
cbx_showplots = tk.Checkbutton(root, width=20,
text='Show Plots after run',
variable=bvar_cbx_showplots,
relief='groove', anchor='w')
cbx_showplots.grid(row=1, column=2, sticky='W')
bvar_cbx_saveres = tk.BooleanVar(value=True)
cbx_saveres = tk.Checkbutton(root, width=20,
text='Save simulation results',
variable=bvar_cbx_saveres,
relief='groove', anchor='w')
cbx_saveres.grid(row=2, column=2, sticky='W')
root.mainloop()
Related
I currently have this grid
https://imgur.com/a/ZELwflE
I want to make it like this:
https://imgur.com/a/SnBHW2S
Would it be possible? Heres my code:
import random
from tkinter import *
root = Tk()
root.title("TOMBOLA")
root.resizable(0, 0)
root.config(bg="WHITE")
entry= Entry(root, width= 40)
entry.focus_set()
entry.grid(column=1, row=0, padx=25)
texto=Label(root, text="Introduce el nombre para agregar a la tómbola:", font=("Courier")).grid(column=0, row=0, padx=(10,0))
boton_ok=Button(root, text="OK", width=10, height=2)
boton_ok.grid(row=0, column=3, padx=10, pady=(25,0))
listaindic = Label(root, text="Lista: ")
listaindic.grid(row=1, column=1, sticky=W)
display = Label(root, text="")
display.grid(row=1, column=2, columnspan=1, sticky=E)
boton_sig=Button(root, text="INICIAR TOMBOLA").grid(column=0, row=1, columnspan=1, pady=(0,15))
root.mainloop()
Thank you all so much
I tried making columnspan bigger, but didnt end well.
Tkinter relies on cells and rows to display widgets, without these there is no functionality. This being the case there is really no way of doing what you are asking in the first image. Everything has to be in a cell. So how I would try to fix your problem is by creating a tkinter.Frame and insert it into the cell you are trying to configure (1, 1). This creates another grid inside the frame so we can choose what to do with it. e.g: increasing the weight on the second column to make it seem much bigger.
newFrame = Frame(master=root)
newFrame.grid_rowconfigure(0, weight=1)
newFrame.grid_columnconfigure(0, weight=1)
newFrame.grid_columnconfigure(1, weight=3)
listaindic = Label(newFrame, text="Lista: ")
listaindic.grid(row=0, column=0, sticky=W)
This shows you how to create a basic frame, and putting the Label into the first cell.
I want to display images on a Canvas within a Frame. For that I want the Canvas to have a Scrollbar. So I created a LabelFrame and assigned a Canvas for it:
wrapper1 = LabelFrame(self.root)
wrapper1.grid(row=1, columnspan=6, sticky="WE")
image_canvas = Canvas(wrapper1)
image_canvas.grid(sticky="NS")
Then I tried to add the Scrollbar:
yscrollbar = Scrollbar(wrapper1, orient="vertical", command=image_canvas.yview)
yscrollbar.grid(sticky="SNE", row=0, column=6)
image_canvas.configure(yscrollcommand=yscrollbar.set)
image_canvas.bind("<Configure>", lambda e: image_canvas.configure(scrollregion=image_canvas.bbox("all")))
All of it works apart from the fact that the Scrollbar doesn't properly stick to the right edge of the Frame:
As you can see it's rather in the middle. I also tried the same thing with buttons to no avail. Prior to this I also set up some buttons on self.root. I don't know if they mess up the grid somehow, as they are not in the LabelFrame:
BrowseButton = Button(self.root, text="Test1", command=self.browse)
BrowseButton.grid(row=3, column=0, sticky="WE")
ConvertButton = Button(self.root, text="Test2", command=self.search)
ConvertButton.grid(row=3, column=5, sticky="WE")
SimilarImages = Button(self.root, text="Test3", command=self.compare)
SimilarImages.grid(row=2, column=5, sticky="WE")
How do you make the Scrollbar stick correctly to the right side, while also filling out the whole Frame vertically?
I just got started using Tkinter and I'm facing a weird problem, basically, I want my app to look something like this
So in order to do that, I created two Frames, one for menu items and the other one to display the content. Strange thing, when I initialize the frames with the given width and height the program seems to work as expected, but when I put some widgets inside the window resizes, it looks like this
Could somebody please explain this weird behaviour to me? What am I missing? Also, I would like to mention that when I add the buttons to the menu frame the width changes to fit the button width, not vice versa as I would like
app = tk.Tk()
app.resizable(False, False)
menu_frame_users = tk.Frame(app, width=200, background='red')
content_frame = tk.Frame(app, height=600, width=600, background='blue')
hello_label = tk.Label(menu_frame_users, text='Hello, User').grid(column=0, row=0, sticky='we')
view_profile_button = tk.Button(menu_frame_users, text="View Profile").grid(column=0, row=1, sticky='we')
invoices_button = tk.Button(menu_frame_users, text="Invoices").grid(column=0, row=2, sticky='we')
bookings_button = tk.Button(menu_frame_users, text="View bookings").grid(column=0, row=3, sticky='we')
tools_button = tk.Button(menu_frame_users, text="Search tools").grid(column=0, row=4, sticky='we')
test_label = tk.Label(content_frame, text='View profile')
test_label.grid(column=0, row=0, sticky='we')
menu_frame_users.grid(column=0, row=0, sticky='nswe')
content_frame.grid(column=1, row=0, sticky='nswe')
The frames in tkinter will only be as big as the widgets contained within unless you add weight to row and columns to make them expand.
You can get the frame to expand by setting the size of the window and then adding weight to the appropriate row and column.
app.geometry('500x400')
app.grid_columnconfigure(1, weight=1)
app.grid_rowconfigure(0, weight=1)
You can play around with the size of the window and then resize and position your buttons until you get the layout you want.
You can also use:
app.grid_columnconfigure(1, minsize=300)
However this only applies when the column contains a widget.
I'm not sure if I fully understand the question, but maybe this will help. Note I removed the explicit frame dimensions for the sake of the example.
import tkinter as tk
app = tk.Tk()
app.resizable(False, False)
menu_frame_users = tk.Frame(app,background='red')
content_frame = tk.Frame(app, background='blue')
app.geometry("500x500")
app.rowconfigure(0, weight=1)
app.columnconfigure(0, weight=1)
menu_frame_users.columnconfigure(0, weight=1)
hello_label = tk.Label(menu_frame_users, text='Hello, User').grid(column=0, row=0, sticky='we')
view_profile_button = tk.Button(menu_frame_users, text="View Profile").grid(column=0, row=1, sticky='we')
invoices_button = tk.Button(menu_frame_users, text="Invoices").grid(column=0, row=2, sticky='we')
bookings_button = tk.Button(menu_frame_users, text="View bookings").grid(column=0, row=3, sticky='we')
tools_button = tk.Button(menu_frame_users, text="Search tools").grid(column=0, row=4, sticky='we')
test_label = tk.Label(content_frame, text='View profile')
test_label.grid(column=0, row=0, sticky='we', padx=20, pady=20)
menu_frame_users.grid(column=0, row=0, sticky='nswe')
content_frame.grid(column=1, row=0, sticky='nswe')
app.mainloop()
Documentation for tkinter is a bit limited but there's some great info regarding grid configuration on this page.
Generally speaking, the widgets in a given container are what give the container it's dimensions, unless explicitly coded otherwise. (In other words, the frame will grow as you add things into it, not the other way around)
In your example, I added an arbitrary window size (you can also specify an offset in that string argument). My guess is you're looking for rowconfigure() and columnconfigure(). Also, you can add some padding to space things out with .grid()
I almost exclusively use the grid geometry manager, but sometimes you might find it more pragmatic to use pack() or place(), just make sure you don't use both at the same time.
Cheers.
I am trying to write a small simon says game using tkinter in python, but am having some spacing issues. In my code I create four buttons, one for each colour, and space them in different columns. Then, I create two labels, for borders to seperate the buttons. There is a horizontal label, and a vertical label. The code for the two labels is similar, with switches for height versus width, etc. Yet, I am finding the horizontal label displays as taller than the vertical label displays wide.
My code is as follows:
from Tkinter import *
var = 100
def colour(col):
print col
root = Tk()
for x in range(2 * var + 1):
Grid.columnconfigure(root, x, weight=1, minsize=2)
Grid.rowconfigure(root, x, weight=1, minsize=2)
red = Button(root, bg="RED", bd=0, relief=FLAT, command=lambda: colour("RED"))
red.grid(row=0, column=0, rowspan=var, columnspan=var, sticky=N+W+E+S)
blue = Button(root, bg="BLUE", bd=0, relief=FLAT, command=lambda: colour("BLUE"))
blue.grid(row=0, column=var+1, rowspan=var, columnspan=var, sticky=N+W+E+S)
green = Button(root, bg="GREEN", bd=0, relief=FLAT, command=lambda: colour("GREEN"))
green.grid(row=var+1, column=0, rowspan=var, columnspan=var, sticky=N+W+E+S)
yellow = Button(root, bg="YELLOW", bd=0, relief=FLAT, command=lambda: colour("YELLOW"))
yellow.grid(row=var+1, column=var+1, rowspan=var, columnspan=var, sticky=N+W+E+S)
border_vertical = Label(root, bg="BLACK")
border_vertical.grid(row=0, column=var, rowspan=2*var+1, columnspan=1, sticky=N+W+E+S)
border_horizontal = Label(root, bg="BLACK")
border_horizontal.grid(row=var, column=0, rowspan=1, columnspan=2*var+1, sticky=N+W+E+S)
# It seems that the horizontal line is starting and expanding thicker than the vertical line.
# The reason for this is unknown, as they are identical in code.
root.mainloop()
And here is how it displays.
In the code I used a variable var, but that was just so I could figure out how large I wanted the window to be.
I've tried padding, which seemed to make the vertical border more like the horizontal border, but I would prefer if the horizontal border were more like the vertical border in attributes, because the vertical border scales similarly to the buttons, whereas the horizontal border seems to scale separately.
Thanks for any and all help!
Using a Label as a divider means it's going to have a height sufficient for text (even if there isn't any text in it). You can get the effect you want if you use a Frame instead.
border_vertical = Frame(root, bg="BLACK")
border_vertical.grid(row=0, column=var, rowspan=2*var+1, columnspan=1, sticky=N+W+E+S)
border_horizontal = Frame(root, bg = 'BLACK')
border_horizontal.grid(row=var, column=0, rowspan=1, columnspan=2*var+1, sticky=N+W+E+S)
I have a Labelframe and inside that LabelFrame, I've placed a button. That button will always appear in the top-left corner of the LabelFrame, though I would like it to center itself within the LabelFrame. What property am I missing that will force this button to center itself inside of the LabelFrame?
self.f1_section_frame=LabelFrame(self.mass_window, text="LOCATIONS", width=300, height=998, padx=5, pady=5, bd=5)
self.f1_section_frame.grid(row=0, rowspan=6, column=1, sticky="nw", padx=(2,0))
self.f1_section_frame.grid_propagate(False)
self.button_frame1 = LabelFrame(self.f1_section_frame, width=275, height=50)
self.button_frame1.grid_propagate(False)
self.button_frame1.grid(row=1, column=0)
self.b1_scoring=Button(self.button_frame1, text="CONFIRM\nLOCATION(S)", height=2, width=10, command=self.initiate_site_scoring, justify="center")
self.b1_scoring.grid(row=0,column=0, pady=(1,0))
Thanks for the response #R4PH43L. I gave that a shot and it didn't seem to change. However, it got me thinking so I removed "grid_propagate" from the frame that encloses my buttons, which then wrapped the frame around the buttons without any space and centered the frame within the column in which IT was placed. Then I used padx=(x,0) on my leftmost button and padx=(0,x) on my rightmost button to add the space needed on the left and right side and it's working how I need it to now.
self.f1_section_frame=LabelFrame(self.mass_window, text="LOCATIONS", width=300,
height=998, padx=5, pady=5, bd=5)
self.f1_section_frame.grid(row=0, rowspan=6, column=1, sticky="nw", padx=(2,0))
self.f1_section_frame.grid_propagate(False)
self.button_frame1 = LabelFrame(self.f1_section_frame, width=275, height=50)
self.button_frame1.grid(row=1, column=0)
self.b1_scoring=Button(self.button_frame1, text="CONFIRM\nLOCATION(S)", height=2, width=10,
command=self.initiate_site_scoring, justify="center")
self.b1_scoring.grid(row=0,column=0, padx=(15,0))
self.b2_scoring=Button(self.button_frame1, text="CLEAR\nSELECTION(S)", height=2,
width=10, command=self.clear_selected_locations)
self.b2_scoring.grid(row=0,column=1)
self.b3_scoring=Button(self.button_frame1, text="UPDATE\nSELECTION(S)", height=2, width=10,
command=self.update_selected_location_details)
self.b3_scoring.grid(row=0,column=2, padx=(0,15))