Why the left frame is smaller than the right one? – grid layout

Question

I’m new to the grid layout (used place for years).
I want to create a window with two frames on the upper half and one frame in the lower.

Here’s my Class code:

import customtkinter as ctk


class SettingsWindow(ctk.CTk):
    def __init__(self):
        super().__init__()

        self.title('Einstellungen')
        self.geometry('1000x750+10+10')
        self.grid_rowconfigure(0, weight=1)
        self.grid_rowconfigure(1, weight=1)
        self.grid_columnconfigure(0, weight=1)
        self.grid_columnconfigure(1, weight=1)

        self.frame_settings = ctk.CTkFrame(self, border_width=1, border_color='black')
        self.frame_settings.grid(row=0, column=0, sticky='nesw', padx=(5, 5), pady=(5, 5))
        self.frame_settings.grid_columnconfigure(0, weight=1)

        self.label_settings = ctk.CTkLabel(self.frame_settings, bg_color='lightgrey', text='Einstellungen')
        self.label_settings.grid(row=0, column=0, columnspan=2, padx=(5, 5), pady=(5, 5))

        self.frame_database_settings = ctk.CTkFrame(self, border_width=1, border_color='black')
        self.frame_database_settings.grid(row=0, column=1, sticky='nesw', padx=(5, 5), pady=(5, 5))
        self.frame_database_settings.grid_columnconfigure(0, weight=1)

        self.label_database_settings = ctk.CTkLabel(self.frame_database_settings, bg_color='lightgrey',
                                                    text='Datenbank-Einstellungen')
        self.label_database_settings.grid(row=0, column=0, columnspan=2, padx=(5, 5), pady=(5, 5))

        self.frame_rules = ctk.CTkFrame(self, border_width=1, border_color='black')
        self.frame_rules.grid(row=1, column=0, columnspan=2, sticky='nesw', padx=(5, 5), pady=(5, 5))
        self.frame_rules.grid_columnconfigure(0, weight=1)

        self.label_rules = ctk.CTkLabel(self.frame_rules, text='Regeln')
        self.label_rules.grid(row=0, column=0, columnspan=2, pady=(5, 5))


SettingsWindow().mainloop()

When I run it the upper left frame is smaller than the right one, but I want the left and right one at the same width.
How can I do this?

Asked By: Schnieker

||

Source

Answer 1

If you’re using grid and want columns to be sized directly proportional to their weight, set the uniform property of both columns to the same value. It doesn’t matter what the value is, all columns with the same value will be uniformly sized based on their weight.

If you don’t use the uniform setting, then each column will start as small as they can be, and then any extra space will be allocated according to their weight.

What that means is that, in this specific case, the right column will initially be wider because the label is wider than the one on the left. Then, extra space is added equally to each column due to the weight argument. Because the right frame starts out wider and then gets the same extra space as the left, it remains wider.

self.grid_columnconfigure(0, weight=1, uniform=1)
self.grid_columnconfigure(1, weight=1, uniform=1)

Answered By: Bryan Oakley

Why the left frame is smaller than the right one? – grid layout

Question:

Answers: