CODEWITHSUNDEEP
pythonpython-3.xtkinter
carbaretta
carbaretta

Reputation: 326

How to explicitly resize frames in tkinter?

so i'm currently working on a piece of code that'll be integrating into something else later to act as a settings configurator. For the time being, i want to have a window that is laid out like you see below: Layout

where each coloured box is a frame. This window is not resizable and will always be 480x720 pixels. As such, i want the 3 frames im using, sideBar(yellow), container (blue) and static(red) to always remain the same size and fill the window as pictured above with roughly the same ratios (doesn't need to be exact).

The code for this window is below

        self.window = tk.Tk()

        self.windowHeight = 480
        self.windowLength = 720
        self.windowDimensions = str(self.windowLength)+"x"+str(self.windowHeight) #make diemnsions string; dimensions are set as a single string
        self.window.geometry(self.windowDimensions)
        self.window.resizable(width=False, height=False)

        self.container = tk.Frame(self.window, relief="sunken", borderwidth=2) #instantiate new window
        self.sideBar = tk.Frame(self.window,  relief="sunken", borderwidth=2)
        self.static = tk.Frame(self.window, relief="sunken", borderwidth=2)

        self.sideBar.grid_propagate(False)
        self.sideBar.grid(row=0, column=0)
        self.container.grid(row=0,column=1)
        self.static.grid(row=5, column=1)


        self.configuratorObject = configuratorObject 

        audioButton = tk.Button(self.sideBar, text="Audio Page", command=lambda: self.raisePage("audioPage"))
        colourButton = tk.Button(self.sideBar, text="Colours", command=lambda: self.raisePage("coloursPage"))
        saveButton = tk.Button(self.static, text = "Save", state="disabled")
        applyButton = tk.Button(self.static, text = "Apply", state="disabled")
        audioButton.pack()
        colourButton.pack()
        saveButton.pack()
        applyButton.pack()

I've attempted to change the height and width parameters of the grids, but they really don't seem to be doing anything. So how could i go about explicitly defining the layout and sizes of the frames?

Any help is appreciated

Upvotes: 4

Views: 858

Answers (1)

Bryan Oakley
Bryan Oakley

Reputation: 385800

In the comments you wrote

If theres a way of getting tkinter to do it then that'd be great

That is definitely the preferred way, over forcing widgets to be a particular size.

We'll start by using pack instead of grid for the three frames. For such a basic layout it requires fewer lines of code than grid.

self.sideBar.pack(side="left", fill="y")
self.static.pack(side="bottom", fill="x")
self.container.pack(side="top", fill="both", expand=True)

Next, add the buttons on the left. This will cause the left frame to shrink in width to fit the buttons. Because we used fill="y", the height will be forced to remain the full height of the window.

audioButton.pack(side="top", fill="x")
colourButton.pack(side="top", fill="x")

Finally, add the buttons on the bottom. Your original code shows them stacked top-to-bottom but your illustration shows them in a single horizontal row. This example adheres to the illustration.

applyButton.pack(side="right", padx=10)
saveButton.pack(side="right", padx=10)

With that we end up with a window that looks like the following, and the proportions and orientation stays exactly the same when you resize the window:

screenshot

Note: you can do this with grid too, but it requires a few more lines of code to apply weights to the rows and columns. I personally prefer pack when the layout doesn't naturally fit in a grid since it requires fewer lines of code.

Upvotes: 6

Related Questions