Search code examples
pythonuser-interfacetkintergrid

Tkinter custom widget columns not filling entire width of frame (inside main window)


Parameters from a database will be iterated into a custom widget which will be packed into a predefined frame (with certain width, height, and position). The custom widget function can be shown below:

class customWidget(Frame):
    def __init__(self, master, firstName, lastName, phoneNumber, email):
      Frame.__init__(self, master, bd=2, relief='raised', width=911, bg="#F8F9FB", borderwidth=0,highlightthickness=0)

      first_name_label = Label(self, text=firstName)
      last_name_label = Label(self, text=lastName)
      phone_number_label = Label(self, text=phoneNumber)
      email_label = Label(self, text=email)

      self.columnconfigure(0, weight=1)
      self.columnconfigure(1, weight=1)
      self.columnconfigure(2, weight=1)
      self.columnconfigure(3, weight=1)
      
      first_name_label.grid(row=0, column=0, padx=5, pady=5)
      last_name_label.grid(row=0, column=1, padx=5, pady=5)
      phone_number_label.grid(row=0, column=2, padx=5, pady=5)
      email_label.grid(row=0, column=3, padx=5, pady=5, sticky="e")

      self.pack(expand=False, fill="x", side="top", pady=(5,10))

Sample widgets:

PersonsFrame = Frame(window, width=911, height=476, bg="#f8f9fb")
PersonsFrame.pack()
PersonsFrame.place(x=228,y=175)

customWidget(PersonsFrame, "John", "Cena", "+99 99 9999 999", "example@example.com")
customWidget(PersonsFrame, "Barack", "Obama", "+99 99 9999 999", "example@example.com")
customWidget(PersonsFrame, "Borat", "Sagdiyev", "+99 99 9999 999", "example@example.com")

The outcome is unexpected, although the column weights have been set. The Persons Frame hosting the custom widgets has a width of 911, but most of the width is not utilized, just as minimally as possible.

Gone wrong The data from database is unaligned as full width is not used. What could be the issue / solution?

I tried configuring the columns and weights but no luck.

 self.columnconfigure(0, weight=1)
 self.columnconfigure(1, weight=1)
 self.columnconfigure(2, weight=1)
 self.columnconfigure(3, weight=1)

Solution

  • Thanks to Derek. Solution was to use grid manager and set unifrom config for column grid to True. Sticky = nsew for each field. Omit self.pack since we are using a grid manager.

      self.grid_columnconfigure(0, weight=1, uniform="True")
      self.grid_columnconfigure(1, weight=1, uniform="True")
    
      self.grid()
     
      first_name.grid(row=0, column=0, padx=5, pady=5, sticky="nsew")
      last_name.grid(row=0, column=1, padx=5, pady=5, sticky="nsew")
    
      #Remove self.pack(expand=False, fill="x", side="top", pady=(5,10))