Python Tkinter窗口/框架调整问题对齐问题2.7

Question

I am doing a project at home just trying to create a window with 3(technically 4) frames. I have an upper frame that has 2 frames inside of it(I want a left and right Frame) then I have a lower Frame that covers everything else. That lower frame will eventually have an external process in it, but for now an image that will not take up the full space. The upper space will not split evenly, EVEN THOUGH I split the height and width evenly at one point. I will send my code and show an image below.

def createFrames(self):
    #Main Upper Frame
    topFrame = Frame(height=120, width=800, bd=1, relief=SUNKEN)
    topFrame.pack(side=TOP)

    #Left Frame in Main Upper Frame
    topFrameLeft = Frame(topFrame, height=120, width=400)
    topFrameLeft.pack(side=LEFT)

    #Right Frame in Main Upper Frame
    topFrameRight = Frame(topFrame, height=120, width=400)
    topFrameRight.pack(side=RIGHT)

    #Frame for GPS, Lower
    centerFrame = Frame(width=800, height=400, bg="",
                        colormap="new",bd=3, relief=GROOVE)
    centerFrame.pack(side=BOTTOM, fill=BOTH, expand=True)

    #photo stuff
    photo = PhotoImage(file="GPS_Imitation.gif")
    #scale_w = 3
    #scale_h = 400/200
    #photo = photo.zoom(scale_w, scale_h)
    #photo = photo.subsample(1)
    Image_Label = Label(centerFrame, image=photo)
    Image_Label.photo = photo
    Image_Label.pack(fill=BOTH, expand=True)

    #Label for Left Frame
    Left_Label = Label(topFrameLeft, width=56, text="Audio", bg="gray",
                       fg="blue")
    Left_Label.pack()

    #Label for Right Frame
    Right_Label = Label(topFrameRight, width=60,
                        text="Phone/Notification",
                        bg="Green", fg="Black")
    Right_Label.pack()

I posted the function. I had to do some weird stuff with the code to get it to do this much. but the picture won't expand, it just grays out under and above the picture. and I had to modify the topleft and topright labels in width and height at random. Any help would be appreciated it. This is written in Python using Tkinter!

Answer 1

It's hard to give a definitive answer because GUI layout really depends a lot on the specifics. What goes in the frames? How do you want them to behave when you resize? What happens if the window is too small?

If I were doing this I would probably get rid of the internal frames and just put everything in a grid since it seems that you have two columns and two or three rows. Though, that decision really depends on what else is going to be put in various rows and columns.

There's nothing wrong with using pack and extra helper frames (this is often my first choice!), grid is arguably the best tool for the job if you want the width of two columns or more columns to be identical.

Grid allows you to configure columns to be in a uniform group . Every column with the same value for the uniform attribute will be the same size. So, for example, to make sure that topFrameLeft and topFrameRight are exactly the same you can put them in a uniform group inside of topFrame .

Start by using grid to place the widgets inside of TopFrame :

topFrameLeft.grid(row=0, column=0, sticky="nsew")
topFrameRight.grid(row=0, column=1, sticky="nsew")

Next, configure the uniform columns. Note: it's a best practice to always give at least one row and one column a weight, even if you use only one row or one column.

topFrame.grid_rowconfigure(0, weight=1)
topFrame.grid_columnconfigure(0, uniform="half", weight=1)
topFrame.grid_columnconfigure(1, uniform="half", weight=1)

Note: You can continue to use pack for all the other widgets. You can freely mix and match pack , place and grid within an application as long as you don't mix them with widgets that share the same parent.