user6142489
user6142489

Reputation: 532

Tkinter Frame and Grid

For the life of me, I cannot understand grid within Frame. I'm trying to create the below configuration, but I'm getting something different (highlighted area is the troublesome part).

Here is the code:

from tkinter import *
root = Tk()

weather_root = Frame(root,width=1000, height=5, bg = 'white')
weather_root.pack(side=TOP)

quote_root = Frame(root,width=1000, height =5, bg = 'white')
quote_root.pack(side=TOP)

news_root = Frame(root,width=1000, height =100, bg = 'white')
news_root.pack(side=TOP,  fill= BOTH)

financial_root= Frame(root,width=1000, height =100, bg = 'white')
financial_root.pack(side=TOP,  fill= BOTH)

# PROBLEM BOX
time_root = Frame(root, bg = 'yellow')
time_root.pack(side = RIGHT,  fill= BOTH)

I'm very new to this still, so I'm sure it's something obvious, but what is it? (In the picture I have it split as two frames - that's the ultimate goal, but in the near term, I'm just trying to get the frame to show up against the right of the current placed frames). Thanks very much!

The expected output:

enter image description here

The actual output:

enter image description here

Upvotes: 0

Views: 2130

Answers (2)

Bryan Oakley
Bryan Oakley

Reputation: 385820

The pack geometry manager is not good for laying things out in a grid. Unsurprisingly, grid is the better choice. It is going to be very difficult to do what you want with pack unless you add additional frames specifically to aid in layout.

Doing this with grid is very straight-forward. It would look something like this:

weather_root.grid(  row=0, column=0, sticky="nsew")
quote_root.grid(    row=1, column=0, sticky="nsew")
news_root.grid(     row=2, column=0, sticky="nsew")
financial_root.grid(row=3, column=0, sticky="nsew")
time_root.grid(     row=0, column=1, sticky="nsew", rowspan=4)

You would also need to use root.grid_rowconfigure and root.grid_columnconfigure to apply weights to the rows and columns that should grow or shrink when the window is resized.

If you want to use pack, I recommend adding two extra frames: one for the left (gray), and one for the right (yellow). You can use pack for those two. Then, on the left you could use pack to stack the areas top-to-bottom. Whether that's the right solution in your specific case, I don't know.


Notes:

  1. I strongly recommend grouping your calls grid or pack in this way. It's much easier to manage when they are all in one spot rather than interleaved with the other code.

  2. I don't recommend using extra whitespace as showin in the example. I did it just to make it easier for you to see how the rows and columns relate.

  3. For the canonical description of how pack works, see http://tcl.tk/man/tcl8.5/TkCmd/pack.htm#M26

Upvotes: 1

Apocalypse How
Apocalypse How

Reputation: 108

The easiest way to accomplish the desired output would be to create two separate sub frames. You can pack the weather, quote, news and financial root frames into the left subframe, then pack the time frame into a right subframe. Last, you would pack them both into root, one using SIDE=LEFT and the other using SIDE=RIGHT. Additionally, it is possible to use Grid and Pack effectively within one app, but one individual widget (frame, for example) can only be managed using one layout manager (grid vs pack) at a time. So you can grid widgets such as frames into a frame, then pack that frame into another frame. Or, you could pack things into a subframe, then grid it into the main frame of the window.

Upvotes: 1

Related Questions