0

I want to add vertical scrollbar to a frame frm3 (in the below code), the scrollbar is appearing but it is not spanning the entire frm3. I have followed the steps in the solution

Vertical scrollbar for frame in Tkinter, Python

I want the scrollbar covering the entire frm3, and the canvas/frame spanning the entire frm3. Not sure why it is showing in the weird way.

enter image description here

The source code

import tkinter as tk
from tkinter import ttk    
from tkinter import BOTTOM, TOP, RIGHT, LEFT, SUNKEN, W, X, Y, NO, VERTICAL, HORIZONTAL, DISABLED, NONE, S, N, E, W

 

class myApp:
    def __init__(self, wnd):
        self.wnd = wnd
        self.wnd.title(f"My App")
        self.wnd.geometry('1300x700')
        self.wnd.resizable(False, False)

     
        self.top_frame = tk.Frame(master=self.wnd, width=1300, height=90, highlightcolor="black", highlightbackground="black",bg="yellow")    
        self.center = tk.Frame(master=self.wnd, width=1300, height=600, highlightcolor="black", highlightbackground="black",)
            self.status_frame = tk.Frame(master=self.wnd, width=1300, height=22, highlightcolor="black", highlightbackground="black", highlightthickness=1,bg='red')

 
        self.wnd.grid_rowconfigure(0, weight=1)
        self.wnd.grid_rowconfigure(1, weight=1)
        self.wnd.grid_rowconfigure(2, weight=1)
    
        self.top_frame.grid(row=0, column=0,sticky="n")
        self.center.grid(row=1, column=0, sticky="n")
        self.status_frame.grid(row=2, sticky="nsew")

 
##############################


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


        self.ctr_left = tk.Frame(self.center, width=900, height=600, highlightcolor="black", highlightbackground="black", highlightthickness=1)
        self.ctr_right = tk.Frame(self.center, width=400, height=600, highlightcolor="black", highlightbackground="black", highlightthickness=1)

       

        self.ctr_left.grid(row=0, column=0, sticky="nsew")
        self.ctr_right.grid(row=0, column=1, sticky="nsew")
       

###############################       
        

        self.ctr_left.grid_rowconfigure(0, weight=1)
        self.ctr_left.grid_rowconfigure(1, weight=1)

       

        self.frm1 = tk.Frame(self.ctr_left, width=900, height=550, highlightcolor="black", highlightbackground="black", bg='green')
        self.frm2 = tk.Frame(self.ctr_left, width=900, height=50, highlightcolor="black", highlightbackground="black", highlightthickness=1,bg='purple')

       

        self.frm1.grid(row=0, column=0, sticky="nw")
        self.frm2.grid(row=1, column=0, sticky="sw")

 

################################

       

        self.ctr_right.grid_rowconfigure(0, weight=1)
        self.ctr_right.grid_rowconfigure(1, weight=1)


        self.frm3 = tk.Frame(self.ctr_right, width=390, height=550, highlightcolor="black", highlightbackground="black", bg='orange')
        self.frm4 = tk.Frame(self.ctr_right, width=390, height=50, highlightcolor="black", highlightbackground="black", highlightthickness=1,bg='pink')


        self.frm3.grid(row=0, column=0, sticky="nw")
        self.frm4.grid(row=1, column=0, sticky="se")


################################       

        self.canvas = tk.Canvas(self.frm3, background='green')
        self.canvas.grid(sticky="e")
       
        scrollbar = tk.Scrollbar(self.frm3, command=self.canvas.yview)
        scrollbar.grid(sticky="ens")
        self.canvas.configure(yscrollcommand = scrollbar.set)

       

        self.canvas.bind('<Configure>', self.on_configure)
       
        self.frame = tk.Frame(self.canvas, background="orange")
        self.canvas.create_window((0,0), window=self.frame, anchor='nw')
       

        for i in range(101):
            self.l = tk.Label(self.frame, text="Hello")
            self.l.grid(row=i, column = 1)
            self.l = tk.Label(self.frame, text=f"World {i}")
            self.l.grid(row=i, column = 2)

       

################################

   

        #add treeview to frame frm1
        self.style = ttk.Style()
        self.style.theme_use("clam")
        self.style.configure("Treeview",
            background="silver",
            foreground="black",
            fieldbackground="silver")

        self.style.map("Treeview", background=[('selected','green')])


        self.my_tree = ttk.Treeview(master=self.frm1, height=26)

#        # define our columns
        self.my_tree['columns'] = ("Column 1","Column 2","Column 3","Column 4","Column 5","Column 6","Column 7","Column 8","Column 9","Column 10",
                                   "Column 11","Column 12","Column 13","Column 14","Column 15","Column 16","Column 17","Column 18","Column 19","Column 20",
                                   "Column 21","Column 22","Column 23","Column 24","Column 25","Column 26","Column 27","Column 28","Column 29","Column 30",
                                   "Column 31","Column 32","Column 33","Column 34","Column 35","Column 36","Column 37","Column 38","Column 39","Column 40",
                                   "Column 41","Column 42","Column 43","Column 44","Column 45","Column 46","Column 47","Column 48","Column 49","Column 50",
                                   "Column 51","Column 52","Column 53","Column 54","Column 55","Column 56","Column 57","Column 58","Column 59","Column 60",
                                   "Column 61","Column 62","Column 63","Column 64","Column 65","Column 66","Column 67","Column 68","Column 69","Column 70",
                                   "Column 71","Column 72","Column 73","Column 74","Column 75","Column 76","Column 77","Column 78","Column 79","Column 80",
                                   "Column 81","Column 82","Column 83","Column 84","Column 85","Column 86","Column 87","Column 88","Column 89","Column 90",
                                   "Column 91","Column 92","Column 93","Column 94","Column 95","Column 96","Column 97","Column 98","Column 99","Column 100"
                                   )
       

        self.my_tree.column("#0", width=0, minwidth=0, stretch=NO)
        self.my_tree.heading("#0", text="", anchor=W)
                           

        for col in self.my_tree['columns']:
            self.my_tree.heading(col, text=f"{col}", anchor=W)
            self.my_tree.column(col, anchor=W, width=9)

           

        self.my_tree.grid(row=0, column=0, sticky="ew")
        #add scrollbar to treevew widget my_tree
        self.ytree_scroll = ttk.Scrollbar(master=self.frm1, orient=VERTICAL, command=self.my_tree.yview)
        self.xtree_scroll = ttk.Scrollbar(master=self.frm1, orient=HORIZONTAL, command=self.my_tree.xview)       

        self.ytree_scroll.grid(row=0, column=0, sticky="nse")
        self.xtree_scroll.grid(row=0, column=0, columnspan=30, sticky="ews")

        self.my_tree.configure(yscroll=self.ytree_scroll.set, xscroll=self.xtree_scroll.set)

        self.my_tree.update()
        for col in self.my_tree['columns']:
            self.my_tree.column(col, anchor=W, width=150, minwidth=60)


    def on_configure(self, event):
        '''Reset the scroll region to encompass the inner frame'''
        self.canvas.configure(scrollregion=self.canvas.bbox("all"))        

 

if __name__ == "__main__":
    window = tk.Tk()
    application = myApp(window)
    window.mainloop()
neo
  • 41
  • 9

0 Answers0