Python Tkinter-将滚动条从框架画布的东边界扩展到西边界

Question

I have a canvas named self.canvas_input_frame with a canvas within called self.canvas_input_image . self.canvas_input_image is where the image is actually displayed. I have attached a child element vertical and horizontal scrollbars to self.canvas_input_frame . My GUI looks like the image below:

The horizontal scrollbar does not extend from west to east completely. How to fix it? Below is my code:

 def open_file_dialog(self):

    self.filename = filedialog.askopenfilename(initialdir = "C:/Users/alyss/AppData/Local/Programs/Python/Python36/Damaged Text Document Virtual Restoration", title = "Select A File", filetype =  (("png", "*.png"),("jpeg", "*.jpg"),  ("pdf", "*.pdf"), ))


    #Create Canvas Frame for Input Document
    self.canvas_input_frame = tk.Canvas(self.main_canvas,  bg = "blue")
    self.canvas_input_frame.configure(width=456, height=470)       
    self.canvas_input_frame.pack(side="left", padx=10,pady = 10)

    #Load Input Image
    load = Image.open(self.filename)      
    render = ImageTk.PhotoImage(load)
    self.width, self.height = load.size

    self.canvas_input_image = tk.Canvas(self.canvas_input_frame,bg = "green") # how to render image in canvas
    self.canvas_input_image.configure(width=390, height=470)
    self.canvas_input_image.image = render
    self.canvas_input_image.create_image(0,0,anchor="nw",image=self.canvas_input_image.image)
    self.canvas_input_image.pack(side="left")


    self.vsb_canvas_input_frame = tk.Scrollbar( self.canvas_input_frame, orient="vertical", command=self.canvas_input_image.yview)
    self.hsb_canvas_input_frame  = tk.Scrollbar( self.canvas_input_frame, orient="horizontal", command=self.canvas_input_image.xview)
    self.canvas_input_image.config(yscrollcommand=self.vsb_canvas_input_frame.set,xscrollcommand=self.hsb_canvas_input_frame.set)
    self.vsb_canvas_input_frame.pack(side = "right", fill = "y")
    self.hsb_canvas_input_frame.pack(side = "bottom", fill = "x")        
    self.canvas_input_image.config(scrollregion = self.canvas_input_image.bbox("all"))

Answer 1

Here the issue is the order of packing widgets. If you change the order of packing the elements like below then it can get you expected view.

self.vsb_canvas_input_frame.pack(side = "right", fill = "y")
self.hsb_canvas_input_frame.pack(side = "bottom", fill = "x")
self.canvas_input_image.pack(side="left")

One way to understand pack method is that if you pack widget1 in 'left' then any other elements can only fit on its opposite side that is 'right'(not left, up or down). Similar logic applies for other sides as well..