Creating "barriers" around the viewing area of a tkinter canvas object

Question

Okay, so I have sort of a unique situation here, so bear with me. I want to be able to create so called "barriers" around the viewing area (the part of the canvas visible to the user) of a tkinter canvas object. For example, take a look at the screenshots below (based on the MCVE at the end):

As you can see in the image above, the line currently goes outside the viewing area of the canvas when the user reaches the end. However, that is not what I want. Instead, I want that whenever the user reaches the end of the canvas's visible area, a "barrier" gets hot, and upon contact, a carriage return occurs , and the line(s) continue(s) on from there. So instead of the above, what I really want is this:

Here is the MCVE I used to take the above screenshots:

import tkinter as TK

xold = None
yold = None

class canvas(TK.Frame):
    def __init__(self, root, *args, **kwargs):
        # Initialize a tkinter frame widget
        TK.Frame.__init__(self, root, width = 800, height = 850, *args, **kwargs)
        self.root = self.winfo_toplevel()
        self.bg = "white"
        self.width, self.height = 850, 800
        self.canvwidth, self.canvheight = 10000, 10000
        # Set up the canvas and its corresponding scrollbars
        self.canvas = TK.Canvas(root, width=850, height=800,
                                 bg=self.bg, borderwidth=0, highlightthickness = 5, highlightbackground = 'brown', highlightcolor = 'brown')
        self.hscroll = TK.Scrollbar(root, command=self.canvas.xview,
                                    orient=TK.HORIZONTAL)
        self.vscroll = TK.Scrollbar(root, command=self.canvas.yview)
        self.canvas.configure(xscrollcommand=self.hscroll.set,
                               yscrollcommand=self.vscroll.set)
        self.rowconfigure(0, weight=1, minsize=0)
        self.columnconfigure(0, weight=1, minsize=0)
        # Add the scrollbars into the root window
        self.canvas.grid(padx=1, pady=1, row=0,
                column=0, rowspan=1, columnspan=1, sticky = 'news')
        self.vscroll.grid(padx=1, pady=1, row=0,
                column=1, rowspan=1, columnspan=1, sticky='news')
        self.hscroll.grid(padx=1, pady=1, row=1,
                column=0, rowspan=1, columnspan=1, sticky='news')
        # Call the `reset` method of the canvas class
        self.reset()
        # Bind the `line` method to the 'l' key of the users keyboard (as an example of what I want)
        self.root.bind('<l>', self.line)

    def reset(self, canvwidth=None, canvheight=None, bg = None):
        ###############################################################################################################################
        # This adds the scrollbars themselves to the canvas and adapts them to the canvas's size (in this case, 10000 x 10000 pixels) #
        ###############################################################################################################################

        if canvwidth:
            self.canvwidth = canvwidth
        if canvheight:
            self.canvheight = canvheight
        if bg:
            self.bg = bg
        self.canvas.config(bg=bg,
                        scrollregion=(-self.canvwidth//2, -self.canvheight//2,
                                       self.canvwidth//2, self.canvheight//2))
        self.canvas.xview_moveto(0.5*(self.canvwidth - self.width + 30) /
                                                               self.canvwidth)
        self.canvas.yview_moveto(0.5*(self.canvheight- self.height + 30) /
                                                              self.canvheight)

    def line(self, event):
        ########################################################################################################
        # Create a short, horizontal, black line on every press of the user's 'l' key (as an example to go by) #
        ########################################################################################################
        global xold, yold
        if xold != None and yold != None:
            pass
        else:     
            xold, yold = 0, 0
        self.canvas.create_line(xold, yold, xold+30, yold, smooth = TK.TRUE, width = 1, capstyle = TK.ROUND, joinstyle = TK.ROUND, fill = 'black')
        xold = xold+30
        yold = yold

if __name__ == '__main__':
    # Create a window, and provide that window to the canvas class as the root window
    root = TK.Tk()
    root.geometry('900x850')
    canvas(root)
    root.mainloop()

Is it possible to add this ability to the MCVE above using tkinter? If so, how would I get started on trying to implement it?

Answer 1

I am not sure what you are actually trying to do (especially trying to constrain drawing in the displayed region while you provide a very large canvas with scrollbars).

For the simplest case, all you need is a bound value and to test xold against it

if xold > 440:
    xold = -410
    yold += 30

If you want to take into account the current displayed area, you have to combine information from canvas scrollregion and xview methods. The first return the bounds of the canvas and former the relative position of the displayed aera in the scrollregion.

    scroll = list(map(int,self.canvas["scrollregion"].split()))
    xview = self.canvas.xview()
    leftbound = scroll[0] + xview[1] * (scroll[2]-scroll[0])
    if xold > leftbound:
        rightbound = scroll[0] + xview[0] * (scroll[2]-scroll[0])
        xold = rightbound
        yold += 30