Tkinter: making a frame inside a canvas the width of the canvas

Question

I'm using a frame inside a canvas so I can add a scrollbar while using a grid layout. I am using a grid layout because the information shown (result) isn't all the same width, but I want the columns to be of the same dimension.

However, I would like for the frame (blue) to take all the space of the canvas (yellow) by dividing all the space evenly between the columns: image here

And here is my code for the picture shown above:

import tkinter as tk

class SeeTransactions():

    def showInterface(self):

        self.frameCanvas = tk.Frame(window)
        self.frameCanvas.grid(row=0, column=0, pady=(5, 0), sticky='news')
        self.frameCanvas.grid_rowconfigure(0, weight=1)
        self.frameCanvas.grid_columnconfigure(0, weight=1)
        self.frameCanvas.grid_propagate(False)

        self.canvas = tk.Canvas(self.frameCanvas, bg = 'yellow')
        self.canvas.grid(row=0, column=0, sticky="news")

        self.frameDatabase = tk.Frame(self.canvas, bg = 'blue')
        self.frameDatabase.grid(row = 0, column = 0, sticky = 'news')

        self.canvas.create_window((0, 0), window=self.frameDatabase, anchor='nw')

        self.vsb = tk.Scrollbar(self.frameCanvas, orient="vertical", command=self.canvas.yview)
        self.vsb.grid(row=0, column=1, sticky='ns')
        self.canvas.configure(yscrollcommand=self.vsb.set)

        self.showDatabase()


    def showDatabase(self):

        result = >some list

        for row in range(len(result)):

            for column in range(1, 5):

                tk.Label(self.frameDatabase, text = result[row][column]).grid(row = row, column = column - 1)

                self.frameDatabase.columnconfigure(column, weight = 1, uniform = 'all')

            tk.Label(self.frameDatabase, text = result[row][5]).grid(row = row, column = 4, columnspan = 2, sticky = 'w')

        self.frameDatabase.columnconfigure(4, weight = 1, uniform = 'all')

        self.frameDatabase.update_idletasks()

        self.frameCanvas.config(width=891, height=400)

        self.canvas.config(scrollregion=self.canvas.bbox("all"))



window = tk.Tk()
window.title('MyBudget')
window.geometry('891x531')

seeTransactions = SeeTransactions()

seeTransactions.showInterface()

window.mainloop()

Does anyone know how to fix it? If so, please let me know. (Using python 3)

You have to use `canvas.bind("", ...`. For example [use canvas to create dynamically window with scroll bar](https://stackoverflow.com/a/58219385/7414759) — stovfl, Nov 21 '19 at 18:56

score 0 · Answer 1 · answered Apr 09 '20 at 18:19

You need a combination of adding a width specification to the label instantiation, and padding in the column configure statement to expand the columns to fit the available space.

The width spec makes sure that all the labels are the same size.

code: import tkinter as tk

class SeeTransactions():

    def showInterface(self):

        self.frameCanvas = tk.Frame(window)
        self.frameCanvas.grid(row=0, column=0, pady=(5, 0), sticky='news')
        self.frameCanvas.grid_rowconfigure(0, weight=1)
        self.frameCanvas.grid_columnconfigure(0, weight=1)
        self.frameCanvas.grid_propagate(False)

        self.canvas = tk.Canvas(self.frameCanvas, bg = 'yellow')
        self.canvas.grid(row=0, column=0, sticky="news")

        self.frameDatabase = tk.Frame(self.canvas, bg = 'blue')
        self.frameDatabase.grid(row = 0, column = 0, sticky = 'news')

        self.canvas.create_window((0, 0), window=self.frameDatabase, anchor='nw')

        self.vsb = tk.Scrollbar(self.frameCanvas, orient="vertical",     command=self.canvas.yview)
        self.vsb.grid(row=0, column=1, sticky='ns')
        self.canvas.configure(yscrollcommand=self.vsb.set)
        self.showDatabase()

def showDatabase(self):
    result = [[f'line{i}{j}' for i in range(10)] for j in range(20)]
    for row in range(len(result)):
        for column in range(1, 5):
            tk.Label(self.frameDatabase, text = result[row][column], width = 15).grid(row = row, column = column - 1)

            self.frameDatabase.columnconfigure(column, weight = 1, uniform = 'all',pad = 100)

        tk.Label(self.frameDatabase, text = result[row][5], width = 15).grid(row = row, column = 4, columnspan = 2, sticky = 'w')

    self.frameDatabase.columnconfigure(4, weight = 1, uniform = 'all',pad = 100)

    self.frameDatabase.update_idletasks()

    self.frameCanvas.config(width=891, height=400)

    self.canvas.config(scrollregion=self.canvas.bbox("all"))



window = tk.Tk()
window.title('MyBudget')
window.geometry('891x531')

seeTransactions = SeeTransactions()

seeTransactions.showInterface()

I just used pad and width amounts to make this example look about right. I left the actual calculations to determine the width and pad amounts as an exercise for y'all — Jim Robinson, Apr 09 '20 at 18:22

Tkinter: making a frame inside a canvas the width of the canvas

1 Answers1