Home > Enterprise >  How can I scroll multiple frames in canvas?
How can I scroll multiple frames in canvas?

Time:11-16

I want to create a list of frames with further features like a button, label e.g.. But my issues are the size of the LabelFrame. If I put the LabelFrame in container it fits like i want to but it isn't scrollable any more. Any ideas?

from tkinter import ttk
import tkinter as tk 

root = tk.Tk()
container = ttk.Frame(root)
canvas = tk.Canvas(container)
scrollbar = ttk.Scrollbar(container, 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)


for i in range(50):
    lf = ttk.Frame(scrollable_frame, text=i).grid(column=1, row=i)

    frame_ip = tk.LabelFrame(lf, bg="white", text=i)
    frame_ip.place(relwidth=0.95, relheight=0.2, relx=0.025, rely=0)
    button_scroll1 = tk.Button(frame_ip, text="Start", bg="grey")
    button_scroll1.place(relwidth=0.15, relx=0.025, relheight=0.15, rely=0.1)

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

root.mainloop()

CodePudding user response:

@Derek maybe you can help me again. I am trying to do something like the picture shows. I take your code and add another scroll bar and label like you did before, but it doesn't work. I tried it again another way and it looks like I would like it to however the scrollbar does not work.

from tkinter import ttk
import tkinter as tk 

root = tk.Tk()
container = ttk.Frame(root)
canvas = tk.Canvas(container)
scrollbar = ttk.Scrollbar(container, 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)


ips = open(self.tempdir,"w")
        count=0
        for i in ips:
            frame_ip = tk.LabelFrame(container, text=f"Frame {count}")
            frame_ip.place(relwidth=0.95, relheight=0.2, relx=0.025, rely=(0.205) * count)

            button_scroll1 = tk.Button(frame_ip, text="Start", bg=self.colorElement)
            button_scroll1.place(relwidth=0.15, relx=0.025, relheight=0.15, rely=0.1)

            canvas_scroll1 = tk.Canvas(frame_ip, bg="white")
            canvas_scroll1.place(relwidth=0.95, relheight=0.7, relx=0.025, rely=0.25)

            scroll1 = tk.Scrollbar(canvas_scroll1)
            scroll1.pack(side="right", fill="y")

            canvas_scroll1.update_idletasks()
            canvas_scroll1.config(yscrollcommand=scroll1.set)
            scroll1.config(command=canvas_scroll1)
            count  = 1rely=0.1)

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

root.mainloop()

enter image description here

CodePudding user response:

Here is your updated code with a Button, Canvas and Scrollbar inserted into each LabelFrame with grid manager.

I've also made the container resizable with row|column configure.

Seems to work fine.

import tkinter as tk
from tkinter import ttk

root = tk.Tk()
root.rowconfigure(0, weight = 1)
root.columnconfigure(0, weight = 1)

root.geometry("341x448")

container = ttk.Frame(root)
container.rowconfigure(0, weight = 1)
container.columnconfigure(0, weight = 1)

canvas = tk.Canvas(container)
scrollbar = ttk.Scrollbar(container, orient = tk.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 = tk.NW)

canvas.configure(yscrollcommand = scrollbar.set)

for i in range(15):
    L = ttk.LabelFrame(scrollable_frame, text = "Sample scrolling label")
    L.grid(row = i, column = 0, sticky = tk.NSEW)

    B = ttk.Button( L, text = f"Button {i}")
    B.grid(row = 0, column = 0, sticky = tk.NW)
    K = tk.Canvas(
        L, width = 300, height = 100,
        scrollregion = "0 0 400 400", background = "#ffffff")
    K.grid(row = 1, column = 0, sticky = tk.NSEW)
    S = ttk.Scrollbar( L, command = K.yview)
    S.grid(column = 1, row = 1, sticky = tk.NSEW)
    K["yscrollcommand"] = S.set

container.grid(row = 0, column = 0, sticky = tk.NSEW)
canvas.grid(row = 0, column = 0, sticky = tk.NSEW)
scrollbar.grid(row = 0, column = 1, sticky = tk.NS)
root.mainloop()
  • Related