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 ie 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()

Answer 1

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 ie 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()

Answer 2

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()