Search code examples
python-3.xuser-interfacetkinterwindowtkinter-layout

Tkinter both 'sticky' and 'rowconfigure' did not fill the empty space

I have 2 frames inside root which called "header_frame" and "activity_frame" both are in the same column which is "column=0". I want both frames to be resizeable matching its root parent filling all empty space like this :

expected layout

I have tried all grid config possibilities including setting 'rowconfigure' on 'root', set activity_frame to stick on "North" which is header_frame, last but not least I've also tried to stick header_frame to south which is the result I do not want because those frame share same size (I hope header_frame has 'maxsize' attribute but sadly it didn't have). so this is the code that I've tried :

self.root = root
self.column = ""
self.search = ""
self.root.minsize(500,480)
self.comboboxValue = None
self.root.title("CUCI (CSV Unique Column Identifier)")
self.root.configure(background="powder blue")
self.root.grid_columnconfigure(0,weight=1)
self.root.grid_rowconfigure(0,weight=1)
self.root.grid_rowconfigure(1,weight=1)

#header frame
self.header_frame = tk.Frame(self.root)
self.header_frame.grid(row=0, column=0,sticky="NEW")
self.header_frame.grid_columnconfigure(0,weight=1)
self.header_frame.grid_rowconfigure(0,weight=1)
self.header_frame.configure(background="grey")

#activity Frame
self.activity_frame = tk.Frame(self.root)
self.activity_frame.grid(row=1, column=0,sticky="NEWS")
self.activity_frame.grid_columnconfigure(0,weight=1)
self.activity_frame.grid_rowconfigure(0,weight=1)
self.activity_frame.configure(background="grey",pady=1)

Here's the layout result from my code which I do not expect: enter image description here

The point is that I want to fill those empty spaces with activity_frame to be stick-ed on 'header_frame'.Please I do not wish to use pack(self.activity_frame.pack(fill=tk.X)). I just want to use grid because it's easy to use

Solution

  • The reason for the gap is because you don't have the header frame stick to the bottom of the space it was given. If you change the sticky attribute for the header to be "nsew" you'll see that the header fills the extra space.

    self.header_frame.grid(row=0, column=0,sticky="nesw")

    I'm guessing you don't want the header frame to be so tall. If that is the case, give row 0 a weight of 0 instead of 1. That way all extra unallocated space will be given to row 1.

    self.root.grid_rowconfigure(0,weight=0)

    After doing so, and after adding a couple of other widgets to simulate your screen, this is what it looks like:

    Screenshot