Asked  6 Months ago    Answers:  5   Viewed   128 times

My objective is to add a vertical scroll bar to a frame which has several labels in it. The scroll bar should automatically enabled as soon as the labels inside the frame exceed the height of the frame. After searching through, I found this useful post. Based on that post I understand that in order to achieve what i want, (correct me if I am wrong, I am a beginner) I have to create a Frame first, then create a Canvas inside that frame and stick the scroll bar to that frame as well. After that, create another frame and put it inside the canvas as a window object. So, I finally come up with this:

from Tkinter import *

def data():
    for i in range(50):
       Label(frame,text=i).grid(row=i,column=0)
       Label(frame,text="my text"+str(i)).grid(row=i,column=1)
       Label(frame,text="..........").grid(row=i,column=2)

def myfunction(event):
    canvas.configure(scrollregion=canvas.bbox("all"),width=200,height=200)

root=Tk()
sizex = 800
sizey = 600
posx  = 100
posy  = 100
root.wm_geometry("%dx%d+%d+%d" % (sizex, sizey, posx, posy))

myframe=Frame(root,relief=GROOVE,width=50,height=100,bd=1)
myframe.place(x=10,y=10)

canvas=Canvas(myframe)
frame=Frame(canvas)
myscrollbar=Scrollbar(myframe,orient="vertical",command=canvas.yview)
canvas.configure(yscrollcommand=myscrollbar.set)

myscrollbar.pack(side="right",fill="y")
canvas.pack(side="left")
canvas.create_window((0,0),window=frame,anchor='nw')
frame.bind("<Configure>",myfunction)
data()
root.mainloop()
  1. Am I doing it right? Is there better/smarter way to achieve the output this code gave me?
  2. Why must I use grid method? (I tried place method, but none of the labels appear on the canvas.)
  3. What so special about using anchor='nw' when creating window on canvas?

Please keep your answer simple, as I am a beginner.

 Answers

51

"Am i doing it right?Is there better/smarter way to achieve the output this code gave me?"

Generally speaking, yes, you're doing it right. Tkinter has no native scrollable container other than the canvas. As you can see, it's really not that difficult to set up. As your example shows, it only takes 5 or 6 lines of code to make it work -- depending on how you count lines.

"Why must i use grid method?(i tried place method, but none of the labels appear on the canvas?)"

You ask about why you must use grid. There is no requirement to use grid. Place, grid and pack can all be used. It's simply that some are more naturally suited to particular types of problems. In this case it looks like you're creating an actual grid -- rows and columns of labels -- so grid is the natural choice.

"What so special about using anchor='nw' when creating window on canvas?"

The anchor tells you what part of the window is positioned at the coordinates you give. By default, the center of the window will be placed at the coordinate. In the case of your code above, you want the upper left ("northwest") corner to be at the coordinate.

Tuesday, June 1, 2021
 
Crontab
answered 6 Months ago
94

Your scrollbars need to have the Frame as a parent, not the Canvas:

from tkinter import *
root=Tk()
frame=Frame(root,width=300,height=300)
frame.pack(expand=True, fill=BOTH) #.grid(row=0,column=0)
canvas=Canvas(frame,bg='#FFFFFF',width=300,height=300,scrollregion=(0,0,500,500))
hbar=Scrollbar(frame,orient=HORIZONTAL)
hbar.pack(side=BOTTOM,fill=X)
hbar.config(command=canvas.xview)
vbar=Scrollbar(frame,orient=VERTICAL)
vbar.pack(side=RIGHT,fill=Y)
vbar.config(command=canvas.yview)
canvas.config(width=300,height=300)
canvas.config(xscrollcommand=hbar.set, yscrollcommand=vbar.set)
canvas.pack(side=LEFT,expand=True,fill=BOTH)

root.mainloop()

The reason why this works is due to how pack works. By default it will attempt to shrink (or grow) a container to exactly fit its children. Because the scrollbars are children of the canvas in the original example, the canvas shrinks to fit.

If you want the scrollbars to appear inside the canvas, the trick is to use an extra frame. Place the canvas and scrollbars in this inner frame, turn the borders off of the canvas and on for the frame. Set the background of the frame to be the same as the canvas and it will appear that the scrollbars are inside the canvas.

Wednesday, June 2, 2021
 
huhushow
answered 6 Months ago
10

You're calling canvas.config(scrollregion = canvas.bbox('all')) when the canvas is still empty, effectively making the scrollregion (0, 0, 1, 1).

You should wait with defining the scrollregion until you have the widgets in your Frame. To do that you should rename canvas to self.canvas in your AutoScrollable class and call

autoScrollable.canvas.config(scrollregion = autoScrollable.canvas.bbox('all'))

right after

autoScrollable.frame.update_idletasks()

You could also bind a <Configure> event to your autoScrollable.frame which calls both the update_idletasks() and updates the scrollregion. That way, you don't have to worry about calling it yourself anymore because they update whenever the Frame's size is changed.

    self.frame.bind('<Configure>', self.frame_changed)

def frame_changed(self, event):
    self.frame.update_idletasks()
    self.canvas.config(scrollregion = self.canvas.bbox('all'))
Sunday, August 29, 2021
 
Michal Charemza
answered 3 Months ago
43

You need to tell the canvas what part of the drawing space to scroll. Use something like:

canvas.config(scrollregion=canvas.bbox(ALL))

More information can be found here: http://effbot.org/tkinterbook/canvas.htm#coordinate-systems

Tuesday, October 12, 2021
 
Kevin_Kinsey
answered 2 Months ago
16

The trick is to use Frames and add the Scrollbars to the Frames instead of to Root.

from Tkinter import *

root = Tk()

left = Frame(root)
right = Frame(root)

t_start = Text(left, width=20)
t_start.pack(side=LEFT, fill=Y)
s_start = Scrollbar(left)
s_start.pack(side=RIGHT, fill=Y)
s_start.config(command=t_start.yview)
t_start.config(yscrollcommand=s_start.set)

t_end = Text(right, width=20)
t_end.pack(side=LEFT, fill=Y)
s_end = Scrollbar(right)
s_end.pack(side=RIGHT, fill=Y)
s_end.config(command=t_end.yview)
t_end.config(yscrollcommand=s_end.set)

left.pack(side=LEFT, fill=Y)
right.pack(side=RIGHT, fill=Y)

root.geometry("500x200")
root.mainloop()

Two TkInter Text with Scrollbars

Monday, October 25, 2021
 
aurelijusv
answered 1 Month ago
Only authorized users can answer the question. Please sign in first, or register a free account.
Not the answer you're looking for? Browse other questions tagged :  
Share