Tkinter: Migrating from purely grid to frame-in-canvas structure

Question

I have code which so far was using purely grid strcuture to place buttons and text, but this did not allow me to place a vertical scrollbar. I need to change my code to put it in a canvas which has a frame, and then the frame needs to buttons+text and canvas needs to have a vertical scroll bar.

The code is as follows:

import tkinter as tk
from pixelregex import regex

class App(tk.Tk):

    def __init__(self):
        tk.Tk.__init__(self)

        self.num_snippets = 1

        self.initialize()

    def initialize(self):

        self.grid()
        self.entryVariable = tk.StringVar()

        # Just some buttons on the window
        button_start = tk.Button(self, text=u"Start", command=self.onStart)
        button_start.grid(row=0, column=0, sticky="EW")

        button_reset = tk.Button(self, text=u"Quit", command=self.onReset)
        button_reset.grid(row=0, column=1, sticky="EW")

        self.entry = tk.Entry(self, textvariable=self.entryVariable)
        self.entry.grid(row=0, column=2, sticky="EW")

        self.columnconfigure(1, weight=1)

    def onStart(self):

        # Get the value entered in the Entry widget
        dim = self.entryVariable.get()
        try:
            dim = int(dim)
        except ValueError:
            dim = 2  # Default
            print("Non integral dimension as input. Setting it to two ..")

        # FUnction that returns a list having 4 strings
        reg = regex.getRegex(dim)

        row_num = str(self.num_snippets)
        snippet_id = tk.Label(self, text=row_num, anchor="w", fg="blue", bg="white")
        snippet_id.grid(column=0, row=self.num_snippets, columnspan=1, sticky='EW')

        text = tk.Text(self, width=100, height=10)
        text.grid(row=self.num_snippets, column=1, columnspan=2, sticky="EW")

        input_string = "Top: " + reg[0] + "\n\n" + "Bottom: " + reg[1] + "\n\n" + "Left: " + reg[
            2] + "\n\n" + "Right: " + reg[3] + "\n\n"
        text.insert('1.0', input_string)

        self.num_snippets += 1

    def onReset(self):
        self.destroy()
        pass

I've tried making a canvas, putting a frame in it, using that frame to insert buttons using grid() but the canvas remains empty! I also need to insert a vertical scrollbar.

Help is highly appreciated.

As written, this question is too broad. It sounds like you are asking us to write the code for you. I don't see any code related to a frame in a canvas. What research have you done! What have you done to try and solve this yourself? Have you searched this sight for examples of scrollable frames? — Bryan Oakley
You can place a vertical scroll bar with tkinter without issues. — Mike - SMT
What information are you needing to scroll? Do you just need a scrollbar for the Text widget? — Bryan Oakley

Mike - SMT Mike - SMT · Accepted Answer · 2017-07-11T16:43:10

You don't need to use canvas for this. You can just use a frame and scrollbar.

Here is an example of a vertical scroll bar being used on a text box.

The only time you need to use a canvas with a scroll bar that I am aware of is if you have multiple frames or multiple widgets you want to scroll all at once.

Here is how to set up a Y axis scrollbar.

import tkinter as tk

class App(tk.Tk):

    def __init__(self):
        tk.Tk.__init__(self)
        self.btnframe = tk.Frame(self)
        self.btnframe.grid(row = 0, column = 0)
        self.textframe = tk.Frame(self)
        self.textframe.grid(row = 0, column = 1, sticky = "nsew")
        self.textframe.columnconfigure(0, weight=1)
        self.textframe.columnconfigure(1, weight=0)
        self.textframe.rowconfigure(0, weight=1)
        self.columnconfigure(1, weight=1)
        self.rowconfigure(0, weight=1)

        button_start = tk.Button(self.btnframe, text=u"Start", command=self.onStart)
        button_start.grid(row=0, column=0, sticky="n")
        button_reset = tk.Button(self.btnframe, text=u"Quit", command=self.onReset)
        button_reset.grid(row=0, column=1, sticky="n")

        self.text = tk.Text(self.textframe, width = 10, height = 10)
        self.text.grid(row=0, column=0, sticky="nsew")

        self.v_scroll_bar = tk.Scrollbar(self.textframe)
        self.v_scroll_bar.grid(row = 0, column = 1, sticky = 'nse')
        self.v_scroll_bar.config(command = self.text.yview)


    def onStart(self):
        for num in range(100):
            self.text.insert("end","{}{}".format(num, "\n"))
            self.text.see("end")


    def onReset(self):
        self.destroy()
        pass

if __name__ == "__main__":
    MyApp = App()
    tk.mainloop()

Tkinter: Migrating from purely grid to frame-in-canvas structure

1 Answers