Home > Blockchain >  Scrollbar isn't working in python tkinter
Scrollbar isn't working in python tkinter

Time:12-29

I want to add a scrollbar that will move the yview of self.MyNetsCanvas. I got the scrollbar linked to the canvas but it's still not working. Also heads up you'll need a json file in order for this to work I added the json code below my python.

Appreciate the help.

Python code:

import json
import ctypes
from tkinter import *
from PIL import Image, ImageTk

ctypes.windll.shcore.SetProcessDpiAwareness(1)

class NetAppHomePG:

   

    def __init__(self):

        self.win = Tk()
        self.win.geometry("3800x2000")
        self.win.title("NetApp")

        self.NavBarFrame = Frame(self.win, background="grey")
        self.TabsFrame = Frame(self.win)

        self.r=0
        self.c=1

        self.Networks = {}

        self.UsableIPs = []

        #NavBar
        self.Logo = Label(self.NavBarFrame, text="NetApp", font=("Roboto", 36), foreground="white", background="grey").grid(row=0, column=0, padx=10, pady=10, sticky=W)
        self.ProfileImg = ImageTk.PhotoImage(Image.open("c:/Users/Will/Desktop/VSC_Test/NetworkApp/user.png"))
        self.Logo = Button(self.NavBarFrame, image=self.ProfileImg, background="grey", border=0).grid(row=0, column=1, padx=3200, pady=10, sticky=E)

        self.NavBar1 = Canvas(self.win, width=3840, height=10, background="grey")
        self.NavBar1.create_line(0, 10, 3840, 10, width=7, fill="grey")
        self.NavBar1.place(x=0,y=151)
        
        #Tabs
        self.TabBtn1 = Button(self.TabsFrame, text="My IPv4 Networks", font=("Roboto", 18), border=0, background="lightblue")
        self.TabBtn1.grid(row=0, column=0, padx=50, pady=300, ipadx=50, sticky=W E)

        self.TabBtn2 = Button(self.TabsFrame, text="Settings", font=("Roboto", 18), border=0, background="lightblue")
        self.TabBtn2.grid(row=1, column=0, padx=50, pady=300, ipadx=50, sticky=N W E)

        self.TabLine1 = Canvas(self.win, width=10, height=1862, background="grey")
        self.TabLine1.create_line(10, 0, 10, 1862, width=6, fill="grey")
        self.TabLine1.place(x=700,y=163)

        #ManageMyNets
        self.NetName = 1
        self.xcor = int(0)
        self.ycor = int(1)
        self.OnlineDotImg = ImageTk.PhotoImage(Image.open("c:/Users/Will/Desktop/VSC_Test/NetworkApp/green-dot.png"))
        self.AddImg = ImageTk.PhotoImage(Image.open("c:/Users/Will/Desktop/VSC_Test/NetworkApp/plus.png"))
        self.AddButton = Button(self.TabsFrame, image=self.AddImg, command=self.Add_Network, border=0)
        self.AddButton.place(x=750, y=50)
        self.NavBarFrame.grid(sticky=W)
        self.TabsFrame.grid(sticky=W)
        #Scrollbar
        self.NetScrollbar = Scrollbar(self.TabsFrame, orient=VERTICAL)
        self.NetScrollbar.grid(row=0, rowspan=4,column=2, sticky=NS)
        self.MyNetsCanvas = Canvas(self.TabsFrame, yscrollcommand=self.NetScrollbar.set)
        self.MyNetsCanvas.grid(row=0, rowspan=4, column=1, pady=200)
        self.NetScrollbar.configure(command=self.MyNetsCanvas.yview)
        
        with open("user.json") as f:
            self.data = json.load(f)
            self.temp = self.data['networks']
            
        for self.network in self.data['networks']:
            self.MyNets = Frame(self.MyNetsCanvas)
            self.MyNets.grid(row=self.r, column=self.c, pady=40)
            if (self.c   1) % 2 ==0:
                self.r  = 1
                self.c = 1
            else:
                self.c  = 1
            for key, value in self.network.items():
                Label(self.MyNets, text=f'{key}: {value}', anchor="w", bg="white", fg="black", font=("Roboto", 14), width=100).pack(padx=150,fill='y')
        
        self.MyNetsCanvas.configure(scrollregion=self.MyNetsCanvas.bbox("all"))

        self.win.mainloop()

Json:

{
  "networks": [
    {
      "Network Name": "wha",
      "Network IP": "10.0.1.0",
      "Subnet": "255.255.255.240",
      "Usable IPs": [
        "10.0.1.1",
        "10.0.1.2",
        "10.0.1.3",
        "10.0.1.4",
        "10.0.1.5",
        "10.0.1.6",
        "10.0.1.7",
        "10.0.1.8",
        "10.0.1.9",
        "10.0.1.10"
      ],
      "Intermediary Devices": "1",
      "Hosts": "9"
    },
    {
      "Network Name": "newnet",
      "Network IP": "192.168.0.0",
      "Subnet": "255.255.255.240",
      "Usable IPs": [
        "192.168.0.1",
        "192.168.0.2",
        "192.168.0.3",
        "192.168.0.4",
        "192.168.0.5",
        "192.168.0.6",
        "192.168.0.7",
        "192.168.0.8",
        "192.168.0.9",
        "192.168.0.10"
      ],
      "Intermediary Devices": "2",
      "Hosts": "8"
    },
    {
      "Network Name": "myNet",
      "Network IP": "192.168.0.12",
      "Subnet": "255.255.255.0",
      "Usable IPs": [
        "192.168.0.13",
        "192.168.0.14",
        "192.168.0.15",
        "192.168.0.16",
        "192.168.0.17",
        "192.168.0.18",
        "192.168.0.19",
        "192.168.0.20",
        "192.168.0.21",
        "192.168.0.22"
      ],
      "Intermediary Devices": "10",
      "Hosts": "200"
    },
    {
      "Network Name": "owibd",
      "Network IP": "10.1.1.10",
      "Subnet": "255.255.255.248",
      "Usable IPs": [
        "10.1.1.11",
        "10.1.1.12",
        "10.1.1.13",
        "10.1.1.14",
        "10.1.1.15",
        "10.1.1.16"
      ],
      "Intermediary Devices": "1",
      "Hosts": "5"
    },
    {
      "Network Name": "owibd",
      "Network IP": "10.1.1.10",
      "Subnet": "255.255.255.248",
      "Usable IPs": [
        "10.1.1.11",
        "10.1.1.12",
        "10.1.1.13",
        "10.1.1.14",
        "10.1.1.15",
        "10.1.1.16"
      ],
      "Intermediary Devices": "1",
      "Hosts": "5"
    },
    {
      "Network Name": "owibd",
      "Network IP": "10.1.1.10",
      "Subnet": "255.255.255.248",
      "Usable IPs": [
        "10.1.1.11",
        "10.1.1.12",
        "10.1.1.13",
        "10.1.1.14",
        "10.1.1.15",
        "10.1.1.16"
      ],
      "Intermediary Devices": "1",
      "Hosts": "5"
    },
    {
      "Network Name": "owibd",
      "Network IP": "10.1.1.10",
      "Subnet": "255.255.255.248",
      "Usable IPs": [
        "10.1.1.11",
        "10.1.1.12",
        "10.1.1.13",
        "10.1.1.14",
        "10.1.1.15",
        "10.1.1.16"
      ],
      "Intermediary Devices": "1",
      "Hosts": "5"
    }
  ]
}

Sorry for the long code.

CodePudding user response:

Here is an example with canvas.create_text instead of labels:

from tkinter import *
import json

y = 0


def on_mousewheel(event):
    canvas.yview_scroll(-event.delta // 120, "units")
    print(event.delta)


root = Tk()
root.geometry("1600x900")
root.title("VerticalScrolledFrame Sample")

frame = Frame(root)
frame.pack(expand=True, fill=BOTH)

canvas = Canvas(frame, scrollregion=(0, 0, 0, 10000))
canvas.bind_all("<MouseWheel>", on_mousewheel)

with open("user.json") as f:
    data = json.load(f)
    temp = data['networks']

for network in data['networks']:

    for key, value in network.items():
        y  = 30
        canvas.create_text(20, 50   y, text=f'{key}: {value}', fill="black", anchor="w", font=("Roboto", 14))

vbar = Scrollbar(frame, orient=VERTICAL)
vbar.pack(side=RIGHT, fill=Y)
vbar.config(command=canvas.yview)
canvas.config(yscrollcommand=vbar.set)
canvas.pack(side=LEFT, expand=True, fill=BOTH)

root.mainloop()

CodePudding user response:

Nevermind I figured it out I just have to add a frame inside the canvas and make sure it was bigger than the canvas.

import json
import ctypes
from tkinter import *
from PIL import Image, ImageTk

ctypes.windll.shcore.SetProcessDpiAwareness(1)

class NetAppHomePG:

   

    def __init__(self):

        self.win = Tk()
        self.win.geometry("3800x2000")
        self.win.title("NetApp")

        self.NavBarFrame = Frame(self.win, background="grey")
        self.TabsFrame = Frame(self.win)

        self.r=0
        self.c=1

        self.Networks = {}

        self.UsableIPs = []

        #NavBar
        self.Logo = Label(self.NavBarFrame, text="NetApp", font=("Roboto", 36), foreground="white", background="grey").grid(row=0, column=0, padx=10, pady=10, sticky=W)
        self.ProfileImg = ImageTk.PhotoImage(Image.open("c:/Users/Will/Desktop/VSC_Test/NetworkApp/user.png"))
        self.Logo = Button(self.NavBarFrame, image=self.ProfileImg, background="grey", border=0).grid(row=0, column=1, padx=3200, pady=10, sticky=E)

        self.NavBar1 = Canvas(self.win, width=3840, height=10, background="grey")
        self.NavBar1.create_line(0, 10, 3840, 10, width=7, fill="grey")
        self.NavBar1.place(x=0,y=151)
        
        #Tabs
        self.TabBtn1 = Button(self.TabsFrame, text="My IPv4 Networks", font=("Roboto", 18), border=0, background="lightblue")
        self.TabBtn1.grid(row=0, column=0, padx=50, pady=300, ipadx=50, sticky=W E)

        self.TabBtn2 = Button(self.TabsFrame, text="Settings", font=("Roboto", 18), border=0, background="lightblue")
        self.TabBtn2.grid(row=1, column=0, padx=50, pady=300, ipadx=50, sticky=N W E)

        self.TabLine1 = Canvas(self.win, width=10, height=1862, background="grey")
        self.TabLine1.create_line(10, 0, 10, 1862, width=6, fill="grey")
        self.TabLine1.place(x=700,y=163)

        #ManageMyNets
        self.NetName = 1
        self.xcor = int(0)
        self.ycor = int(1)
        self.OnlineDotImg = ImageTk.PhotoImage(Image.open("c:/Users/Will/Desktop/VSC_Test/NetworkApp/green-dot.png"))
        self.AddImg = ImageTk.PhotoImage(Image.open("c:/Users/Will/Desktop/VSC_Test/NetworkApp/plus.png"))
        self.AddButton = Button(self.TabsFrame, image=self.AddImg, command=self.Add_Network, border=0)
        self.AddButton.place(x=750, y=50)
        self.NavBarFrame.grid(sticky=W)
        self.TabsFrame.grid(sticky=W)
        self.MyNetsCanvas = Canvas(self.TabsFrame, height=1500, width=2500)
        self.MyNetsCanvas.grid(row=0, rowspan=3, column=1, columnspan=2, pady=200)
        self.MyNetsFrame = Frame(self.MyNetsCanvas, height=10000, width=500)
        self.MyNetsCanvas.create_window(0, 0, window=self.MyNetsFrame, anchor=NW)
        
        
        with open("user.json") as f:
            self.data = json.load(f)
            self.temp = self.data['networks']
            
        for self.network in self.data['networks']:
            self.MyNets = Frame(self.MyNetsFrame)
            self.MyNets.grid(row=self.r, column=self.c, pady=40)
            if (self.c   1) % 2 == 0:
                self.r  = 1
                self.c = 1
            else:
                self.c  = 1
            for key, value in self.network.items():
                Label(self.MyNets, text=f'{key}: {value}', anchor="w", bg="white", fg="black", font=("Roboto", 14), width=100).grid(padx=150)
        
        self.NetScrollbar = Scrollbar(self.TabsFrame, orient=VERTICAL)
        self.NetScrollbar.configure(command=self.MyNetsCanvas.yview)
        self.MyNetsCanvas.configure(yscrollcommand=self.NetScrollbar.set)
        self.NetScrollbar.grid(row=0, rowspan=3, column=3, pady=240, sticky=NS)
        self.MyNetsCanvas.configure(scrollregion=self.MyNetsCanvas.bbox("all"))

        self.win.mainloop()

  • Related