Why does tkinter expand the frames disproportionately with respect to window resize?

Question

In the following example, the 4 frames expand disproportionately when window is expanded. This is especially weird considering that the row and column configure of the frames is weighted 0.

What I want is to lock the size of frame 1 and frame 3 i.e the frames on left and allow frame 2 to expand along x only while allowing frame 4 to expand in both x & y. here is the code:

import tkinter as tk
from tkinter import ttk

def about_info():
    pass

root = tk.Tk()
#root.geometry('300x300')
root.rowconfigure(0,weight=1)
root.columnconfigure(0,weight=1)

m = tk.Menu(root, relief='flat')
#m = tk.Menu(root, relief='ridge')
about = tk.Menu(m, relief='flat')
about.add_command(label='about', command=about_info)
m.add_cascade(label='help',menu=about)
root.config(menu=m)

f1 = ttk.LabelFrame(root, borderwidth="3", relief="ridge", text="Frame 1")
f1.grid(row=0, column=0, columnspan=1, rowspan=1, sticky="nwes")
f1.rowconfigure(0,weight=0)
f1.columnconfigure(0,weight=0)
lbl1 = ttk.Label(f1, text="Label 1")
lbl1.grid(row=0,column=0, sticky="ew")

f2 = ttk.LabelFrame(root, borderwidth="3", relief="ridge", text="Frame 2")
f2.grid(row=0, column=1, columnspan=1, rowspan=1, sticky="nwes")
f2.rowconfigure(0,weight=0)
f2.columnconfigure(0,weight=0)
lbl2 = ttk.Label(f2, text="Label2")
lbl2.grid(row=0,column=0, sticky="ew")

f3 = ttk.LabelFrame(root, borderwidth="3", relief="ridge", text="Frame 3")
f3.grid(row=1, column=0, columnspan=1, rowspan=1, sticky="nwes")
f3.rowconfigure(0,weight=0)
f3.columnconfigure(0,weight=0)
lbl3 = ttk.Label(f3, text="Label3")
lbl3.grid(row=0,column=0, sticky="ew")

f4 = ttk.LabelFrame(root, borderwidth="3", relief="ridge", text="Frame 4")
f4.grid(row=1, column=1, columnspan=1, rowspan=1, sticky="nwes")
f4.rowconfigure(0,weight=0)
f4.columnconfigure(0,weight=0)
lbl4 = ttk.Label(f4, text="Label4")
lbl4.grid(row=0,column=0, sticky="ew")
root.mainloop()

Now the following code is expanding sort of how I want, but adding space in between:

import tkinter as tk
from tkinter import ttk

def about_info():
    pass

root = tk.Tk()
#root.geometry('300x300')
root.rowconfigure((0,0),weight=0)
root.columnconfigure((0,0),weight=0)

root.rowconfigure((0,1),weight=0)
root.columnconfigure((0,1),weight=1)

root.rowconfigure((1,0),weight=1)
root.columnconfigure((1,0),weight=0)

root.rowconfigure((1,1),weight=1)
root.columnconfigure((1,1),weight=1)

m = tk.Menu(root, relief='flat')
#m = tk.Menu(root, relief='ridge')
about = tk.Menu(m, relief='flat')
about.add_command(label='about', command=about_info)
m.add_cascade(label='help',menu=about)
root.config(menu=m)

f1 = ttk.LabelFrame(root, borderwidth="3", relief="ridge", text="Frame 1")
f1.grid(row=0, column=0, columnspan=1, rowspan=1, sticky="wn")
lbl1 = ttk.Label(f1, text="Label 1")
lbl1.grid(row=0,column=0, sticky="ew")

f2 = ttk.LabelFrame(root, borderwidth="3", relief="ridge", text="Frame 2")
f2.grid(row=0, column=1, columnspan=1, rowspan=1, sticky="nw")
lbl2 = ttk.Label(f2, text="Label2")
lbl2.grid(row=0,column=0, sticky="ew")

f3 = ttk.LabelFrame(root, borderwidth="3", relief="ridge", text="Frame 3")
f3.grid(row=1, column=0, columnspan=1, rowspan=1, sticky="ns")
lbl3 = ttk.Label(f3, text="Label3")
lbl3.grid(row=0,column=0, sticky="ew")

f4 = ttk.LabelFrame(root, borderwidth="3", relief="ridge", text="Frame 4")
f4.grid(row=1, column=1, columnspan=1, rowspan=1, sticky="nwes")
lbl4 = ttk.Label(f4, text="Label4")
lbl4.grid(row=0,column=0, sticky="ew")
root.mainloop()

Read [gui layout using frames and grid](https://stackoverflow.com/questions/34276663/tkinter-gui-layout-using-frames-and-grid/34277295#34277295) ***" allow frame 2 to expand along x"***: Don't use `f2.grid(..., sticky="nwes")` if you only want `X`. ***configure of the frames is weighted 0.***: As it stands, it's usless for what you want. — stovfl, Jan 25 '20 at 23:05
how do you count the index of frame grid here 0:3 or 0.0 : 1.1 while passing to the rowconfigure? — preetam, Jan 25 '20 at 23:13
***"index of frame grid"***: No range like `0:3`, only `tuple(0, 1, 3)` means Row `0`, Row `1` and Row `3`. In my example i omitted Row `2`. — stovfl, Jan 25 '20 at 23:27
Is there someway to define different behaviour per cell rather than apply to whole row or column. — preetam, Jan 25 '20 at 23:31
***"behaviour per cell"***: If grided layout don't fit your needs, use [The Tkinter Place Geometry Manager](http://effbot.org/tkinterbook/place.htm) instead. — stovfl, Jan 26 '20 at 00:04

Bryan Oakley · Accepted Answer · 2020-01-26T00:39:15.113

In the following example, the 4 frames expand disproportionately when window is expanded.

The behavior is simply because you give all of the weight in the root window to row 0, column 0. That means that any extra unallocated space will be given to those positions in the root window.

What I want is to lock the size of frame 1 and frame 3 i.e the frames on left and allow frame 2 to expand along x only while allowing frame 4 to expand in both x & y. here is the code:

If you want the frames on the left to not be given extra space in the X direction, you need to set the weight of column zero to zero and give a weight of one to column one. That will cause column one to receive all extra space.

For the rest of the problem, one option is to give all of the row weight to row one, and have frame three "stick" only to the top and the sides while frame four sticks to all sides.

root.columnconfigure(1, weight=1)
root.rowconfigure(1, weight=1)
...
f3.grid(row=1, column=0, sticky="new")
...
f4.grid(row=1, column=1, sticky="nwes")

A second option to prevent frame three from resizing in the Y direction is to set a weight of zero for row zero and one, and then give a weight of one to a third row. You can then have frame four span two rows so that it gets the space allocated to row one plus all of the space allocated to row two.

root.columnconfigure(1, weight=1)
root.rowconfigure(2, weight=1)
...
f4.grid(row=1, column=1, rowspan=2, sticky="nwes")

Here's a complete working example using the first technique, with the grid commands grouped together. My experience has taught me that grouping all of the layout code within a given container makes it much easier to visualize and maintain layout code.

import tkinter as tk
from tkinter import ttk

root = tk.Tk()

f1 = ttk.LabelFrame(root, borderwidth="3", relief="ridge", text="Frame 1")
f2 = ttk.LabelFrame(root, borderwidth="3", relief="ridge", text="Frame 2")
f3 = ttk.LabelFrame(root, borderwidth="3", relief="ridge", text="Frame 3")
f4 = ttk.LabelFrame(root, borderwidth="3", relief="ridge", text="Frame 4")

root.columnconfigure(1, weight=1)
root.rowconfigure(1, weight=1)

f1.grid(row=0, column=0, columnspan=1, rowspan=1, sticky="nwes")
f2.grid(row=0, column=1, columnspan=1, rowspan=1, sticky="nwes")
f3.grid(row=1, column=0, columnspan=1, rowspan=1, sticky="new")
f4.grid(row=1, column=1, columnspan=1, rowspan=1, sticky="nwes")

f1.rowconfigure(0,weight=0)
f1.columnconfigure(0,weight=0)
lbl1 = ttk.Label(f1, text="Label 1")
lbl1.grid(row=0,column=0, sticky="ew")

f2.rowconfigure(0,weight=0)
f2.columnconfigure(0,weight=0)
lbl2 = ttk.Label(f2, text="Label2")
lbl2.grid(row=0,column=0, sticky="ew")

f3.rowconfigure(0,weight=0)
f3.columnconfigure(0,weight=0)
lbl3 = ttk.Label(f3, text="Label3")
lbl3.grid(row=0,column=0, sticky="ew")

f4.rowconfigure(0,weight=0)
f4.columnconfigure(0,weight=0)
lbl4 = ttk.Label(f4, text="Label4")
lbl4.grid(row=0,column=0, sticky="ew")


root.mainloop()

score -1 · Answer 2 · answered Jan 25 '20 at 23:50

Finally got what I wanted, but still feels weird that I had to define a lot more cells than I needed.

import tkinter as tk
from tkinter import ttk

def about_info():
    pass

root = tk.Tk()
#root.geometry('300x300')
root.rowconfigure(0,weight=0)
root.columnconfigure(0,weight=0)

root.rowconfigure(1,weight=0)
root.columnconfigure(1,weight=1)

root.rowconfigure(2,weight=0)
root.rowconfigure(3,weight=1)

m = tk.Menu(root, relief='flat')
#m = tk.Menu(root, relief='ridge')
about = tk.Menu(m, relief='flat')
about.add_command(label='about', command=about_info)
m.add_cascade(label='help',menu=about)
root.config(menu=m)

f1 = ttk.LabelFrame(root, borderwidth="3", relief="ridge", text="Frame 1")
f1.grid(row=0, column=0, columnspan=1, rowspan=1, sticky="ew")
lbl1 = ttk.Label(f1, text="Label 1")
lbl1.grid(row=0,column=0, sticky="ew")

f2 = ttk.LabelFrame(root, borderwidth="3", relief="ridge", text="Frame 2")
f2.grid(row=0, column=1, columnspan=1, rowspan=1, sticky="ew")
lbl2 = ttk.Label(f2, text="Label2")
lbl2.grid(row=0,column=0, sticky="ew")

f3 = ttk.LabelFrame(root, borderwidth="3", relief="ridge", text="Frame 3")
f3.grid(row=1, column=0, columnspan=1, rowspan=1, sticky="ewn")
lbl3 = ttk.Label(f3, text="Label3")
lbl3.grid(row=0,column=0, sticky="ew")

f4 = ttk.LabelFrame(root, borderwidth="3", relief="ridge", text="Frame 4")
f4.grid(row=1, column=1, columnspan=1, rowspan=3, sticky="ewns")
lbl4 = ttk.Label(f4, text="Label4")
lbl4.grid(row=0,column=0, sticky="ew")

f5 = ttk.LabelFrame(root, borderwidth="3", relief="ridge", text="Frame 5")
f5.grid(row=2, column=0, columnspan=1, rowspan=1, sticky="ewns")
lbl5 = ttk.Label(f5, text="Label5")
lbl5.grid(row=0,column=0, sticky="ewn")

root.mainloop()

Why does tkinter expand the frames disproportionately with respect to window resize?

2 Answers2