Home > Software engineering >  Scrollbar canvas is displayed but does not scroll down. Conflict of tabs and frames? How do I resolv
Scrollbar canvas is displayed but does not scroll down. Conflict of tabs and frames? How do I resolv

Time:03-06

enter image description here

Why doesn't the scrollbar go down to the tab X (in Tab1) where the comboboxes are? The scrollbar is displayed, but it does not go down. There are no errors.

On the other hand, if I set scrollable_frame to comboboxes (as I think you should do it right), the comboboxes disappear and are not displayed

What am I doing wrong? Also is there something to fix in the code? Can you show me the code please? (with comments I may not understand) Thank you

I specify that I use Canvas and that I would like to use the tkinter widgets

import tkinter as tk                    
from tkinter import ttk
  
root = tk.Tk()
root.title("Tab Widget")
root.attributes('-zoomed', True)
tabControl = ttk.Notebook(root, style='Custom.TNotebook', width=400, height=220)
  
tab1 = ttk.Notebook(tabControl)
tab2 = ttk.Notebook(tabControl)
  
tabControl.add(tab1, text ='Tab 1')
tabControl.add(tab2, text ='Tab 2')
tabControl.place(x=1, y=1)

#tab 1
a = ttk.Frame(tab1)
canvas = tk.Canvas(a)

scrollbar = ttk.Scrollbar(a, orient="vertical", command=canvas.yview)
scrollable_frame = ttk.Frame(canvas)

scrollable_frame.bind(
    "<Configure>",
    lambda e: canvas.configure(
        scrollregion=canvas.bbox("all")
    )
)

canvas.create_window((0, 0), window=scrollable_frame, anchor="nw")
canvas.configure(yscrollcommand=scrollbar.set)


combo1=ttk.Combobox(a, width = 18)
combo1.place(x=20, y=20)
combo1['value'] = ["text1", "text2"] 
          
combo2=ttk.Combobox(a, width = 18)
combo2.place(x=20, y=80)
combo2['value'] = ["text1", "text2"] 

combo3=ttk.Combobox(a, width = 18)
combo3.place(x=20, y=140)
combo3['value'] = ["text1", "text2"] 

combo4=ttk.Combobox(a, width = 18)
combo4.place(x=20, y=200)
combo4['value'] = ["text1", "text2"]


a.pack()
canvas.pack(side="left", fill="both", expand=True)
scrollbar.pack(side="right", fill="y")


b = ttk.Frame(tab1)
tab1.add(a, text="X")
tab1.add(b, text="Y")


#tab 2
c = ttk.Frame(tab2)
d = ttk.Frame(tab2)

root.mainloop()

CodePudding user response:

In the code you have written, the container widget of the comboboxes is a. In this case, the comboboxes are displayed but the scrollbar does not work because the scrollbar is linked to scrollable_frame, not a.

Now, even if you change the container widget to scrollable_frame, it still doesn't work because you have not given a width and height for scrollable_frame. Therefore, scrollable_frame appears as a dot. (I figured this out by changing it to a tk.Frame and then giving bg = "blue". The frame appeared as a blue dot.)

Also, remember that you need to give a value for height greater than the available height in canvas to make the scrollbar work.

Working Code:

import tkinter as tk                    
from tkinter import ttk
  
root = tk.Tk()
root.title("Tab Widget")
#root.attributes('-zoomed', True)
tabControl = ttk.Notebook(root, style='Custom.TNotebook', width=400, height=220)
  
tab1 = ttk.Notebook(tabControl)
tab2 = ttk.Notebook(tabControl)
  
tabControl.add(tab1, text ='Tab 1')
tabControl.add(tab2, text ='Tab 2')
tabControl.place(x=1, y=1)

#tab 1
a = ttk.Frame(tab1)
canvas = tk.Canvas(a)

scrollbar = ttk.Scrollbar(a, orient="vertical", command=canvas.yview)
scrollable_frame = ttk.Frame(canvas, width = 500, height = 500)

scrollable_frame.bind(
    "<Configure>",
    lambda e: canvas.configure(
        scrollregion=canvas.bbox("all")
    )
)

canvas.create_window((0, 0), window=scrollable_frame, anchor="nw")
canvas.configure(yscrollcommand=scrollbar.set)

combo1=ttk.Combobox(scrollable_frame, width = 18)
combo1.place(x=20, y=20)
combo1['value'] = ["text1", "text2"] 
          
combo2=ttk.Combobox(scrollable_frame, width = 18)
combo2.place(x=20, y=80)
combo2['value'] = ["text1", "text2"] 

combo3=ttk.Combobox(scrollable_frame, width = 18)
combo3.place(x=20, y=140)
combo3['value'] = ["text1", "text2"] 

combo4=ttk.Combobox(scrollable_frame, width = 18)
combo4.place(x=20, y=200)
combo4['value'] = ["text1", "text2"]


a.pack()
canvas.pack(side="left", fill="both", expand=True)
scrollbar.pack(side="right", fill="y")


b = ttk.Frame(tab1)
tab1.add(a, text="X")
tab1.add(b, text="Y")


#tab 2
c = ttk.Frame(tab2)
d = ttk.Frame(tab2)

root.mainloop()
  • Related