How to add a scrollbar to tinker-gui tool?

Question

I'm working on a resume-parser from this link here,

I've cloned it using,

git clone https://github.com/John-8704/ResumeFilter.git

and then just execute:

python utils/create_training_data.py

This just open the tinker GUI tool required for manually annotate data but it doesn't have a scroll bar to scroll through.

So I've edited that script i.e.,create_training_data.py in it I've modified the resume_gui function with below code to add scroll bar functionality but even then the scroll bar is not visible. How can I add scrollbar to it.

To reproduce, Just clone the repo and try running python utils/create_training_data.py

def resume_gui(training_data_dir_path, index, file_path, file_content):
    lines_with_dummy_labels = [[line, -1, -1] for line in file_content]

    master = Tk()
    master.columnconfigure(0, weight=1)
    master.rowconfigure(0, weight=1)
    master.geometry("{0}x{1}+0+0".format(master.winfo_screenwidth(), 
                                         master.winfo_screenheight()))
    canvas = Canvas(master, width=170, height=300)
    vsb = Scrollbar(master, orient="vertical", command=canvas.yview)
    canvas.grid(row=0, column=0, sticky=W + E + N + S)
    vsb.grid(row=0, column=1, sticky=N+S)
    gui = LabelResume(master, lines_with_dummy_labels)

    def callback():
        master.destroy()
        output_file_path = os.path.join(training_data_dir_path, str(index)+'.csv')
        if os.path.exists(output_file_path):
            return
        data = pd.DataFrame.from_records(lines_with_dummy_labels,columns=['text',
                                                                  'type','label'])
        rows_to_drop = data.loc[((data['type']== -1) | (data['label'] == -1))].index
        data.drop(data.index[rows_to_drop],inplace = True,axis = 0)
        data.to_csv(output_file_path,index = False)

    canvas.config(yscrollcommand= vsb.set, scrollregion=canvas.bbox("all"))
    master.protocol("WM_DELETE_WINDOW", callback)
    gui.mainloop()

If someone can help me out I'd really appreciate it.

What does "it's not working" mean, exactly? I don't see where you're adding any content to the Canvas for it to scroll. — jasonharper, Mar 16 '20 at 14:01
@jasonharper I mean the scrollbar is not visible. I'm not very familiar with tinker and I've put it together by following few tutorials online if you just clone and edit the `resume_gui` with above and then execute `python utils/create_training_data.py` the scrollbar will not be visible. — user_12, Mar 16 '20 at 14:04
@stovfl I'm using windows pc and for me `scrollbar` is not visible. Does it have anything to do with screen resolution? Have you used the above function in place of actual function from the original repo — user_12, Mar 16 '20 at 18:36
@user_12 ***"Have you used the above function"***: Yes, but your example violate the [mcve] guidelines, i have to remove some parts. You are using `from tkinter import *`, note the `*`, which could lead to unexpeced behavior. [Edit] your example per the [mcve] guidelines and i will run it again. — stovfl, Mar 16 '20 at 19:15
@stovfl I've modified the example. Can you please help me out. — user_12, Mar 18 '20 at 06:37
@user_12 ***"master = Tk()"***: The instance `master` is local, it seems you are using multiple `Tk()`. Read [Why are multiple instances of Tk discouraged?](https://stackoverflow.com/questions/48045401/why-are-multiple-instances-of-tk-discouraged) — stovfl, Mar 18 '20 at 08:00
@stovfl I'm not getting what you meant. I only have one tk() I'm really never worked with tinker I've only put it together using online tutorials. Can you provide a answer on how can I fix this and get scroll bar to work? — user_12, Mar 18 '20 at 09:01
@user_12 ***"I only have one `tk()`"***: You claim so, then you should get ***`NameError: name 'master' is not defined`***. OK, **indent all** statements so that they belong to the `local namespace` of `def resume_gui(...`. — stovfl, Mar 18 '20 at 12:43
Now i get `NameError: name 'LabelResume' is not defined`, [edit] your question and show `class LabelResume(...`? — stovfl, Mar 18 '20 at 14:04
@stovfl It's a lot of code to paste here. If you can just clone the repo it will all have the necessary classes — user_12, Mar 18 '20 at 14:08

score 1 · Accepted Answer · answered Mar 27 '20 at 18:43

Looking at the LabelResume source, it is adding itself to the window (see line 31). If you comment this out, this behaviour will stop and you can then add the frame to your canvas. The code for the resume_gui is then very similar but I am adding the LabelResume frame to the canvas using canvas.create_window(0, 0, anchor=N + W, window=gui) and then ensuring that it is rendered before updating the canvas scrollregion using gui.update().

def resume_gui(training_data_dir_path, index, file_path, file_content):
    lines_with_dummy_labels = [[line, -1, -1] for line in file_content]

    master = Tk()
    master.columnconfigure(0, weight=1)
    master.rowconfigure(0, weight=1)
    master.state('zoomed')
    canvas = Canvas(master, width=170, height=300)
    vsb = Scrollbar(master, orient="vertical", command=canvas.yview)
    canvas.grid(row=0, column=0, sticky=W + E + N + S)
    vsb.grid(row=0, column=1, sticky=N+S)
    gui = LabelResume(master, lines_with_dummy_labels)

    def callback():
        master.destroy()
        output_file_path = os.path.join(training_data_dir_path, str(index)+'.csv')
        if os.path.exists(output_file_path):
            return
        data = pd.DataFrame.from_records(lines_with_dummy_labels,columns = ['text','type','label'])
        rows_to_drop = data.loc[((data['type']== -1) | (data['label'] == -1))].index
        data.drop(data.index[rows_to_drop],inplace = True,axis = 0)
        data.to_csv(output_file_path,index = False)

    canvas.create_window(0, 0, anchor=N + W, window=gui)
    gui.update()
    canvas.config(yscrollcommand= vsb.set, scrollregion=canvas.bbox("all"))
    master.protocol("WM_DELETE_WINDOW", callback)
    gui.mainloop()

hifromdev · Answer 2 · 2020-03-18T15:42:23.927

In order to use a scrollbar in your code, you're going to need to make a separate frame around the main contents of your webpage since you are using a grid format in order to layout your application.

You can't use pack, grid or anything in the same Frame.

Everything within the frame will use grid layout to display, whereas the frame itself will use the pack function to show the scrollbar.

frame = Frame(master)
frame.pack(anchor=CENTER) 
# relx/y makes sure it covers
# the whole area of the window.

Now instead of gridding the contents to master, grid it to the frame.

scrollbar = Scrollbar(master)
scrollbar.pack( side = RIGHT, fill=Y )

Use the code above in order to create a scrollbar that will go across your whole application vertically where frame is the wrapper around your contents.

After adding the following changes, your code should look a bit like this:

def resume_gui(training_data_dir_path, index, file_path, file_content):
    lines_with_dummy_labels = [[line, -1, -1] for line in file_content]

    master = Tk()

    master.columnconfigure(0, weight=1)
    master.rowconfigure(0, weight=1)
    master.geometry("{0}x{1}+0+0".format(master.winfo_screenwidth(), 
                                         master.winfo_screenheight()))

    frame = Frame(master)
    frame.pack(anchor=CENTER)

    scrollbar = Scrollbar(master)
    scrollbar.pack( side = RIGHT, fill=Y )

    canvas = Canvas(frame, width=170, height=300)
    canvas.grid(row=0, column=0, sticky=W + E + N + S)

    gui = LabelResume(frame, lines_with_dummy_labels)

    canvas.config(yscrollcommand= vsb.set, scrollregion=canvas.bbox("all"))
    gui.mainloop()

can you provide what changes I need to make in my code I've provided above. — user_12, Mar 18 '20 at 15:07
Getting this error `_tkinter.TclError: bad option "-relx": must be -after, -anchor, -before, -expand, -fill, -in, -ipadx, -ipady, -padx, -pady, or -side` — user_12, Mar 18 '20 at 15:19
try removing the relx and rely arguments. I might've gotten the grid and pack args mixed up. — hifromdev, Mar 18 '20 at 15:19
Let us [continue this discussion in chat](https://chat.stackoverflow.com/rooms/209861/discussion-between-d19mc-and-user-12). — hifromdev, Mar 18 '20 at 15:20

How to add a scrollbar to tinker-gui tool?

2 Answers2