Moving Images on a Tkinter Canvas

The stock analysis and comparator app I made was somewhat quick, just a few hours over a weekend. And most of that was just trying different things to formulate the data I wanted to see and compare. The latest project, will take some time and I'm not expecting it to be easy. Really looking forward to learning more how to use Tkinter and other packages that can be used with it.

Purpose of the application: I currently work in a helpdesk for a medium sized company. How we keep track of equipment and the frequency of moving things to different locations brings rise to a glaring need. How do we know where everything is physically located? Of course we have software to keep track of inventory and in what department it is supposedly located. We can also know what switch something is ultimately patched in to. But how do we know the physical location of each device? APs generally have a web UI where you can be place each one on a map. One could have a diagram of what each drop is labeled and where it is in the room. But that could still be a somewhat unclear as to where a PC, printer, or other device is located. I wanted to develop a simple application that would show a floor plan and a user could drag and drop different icons to show where each device is. It's entirely possible this exists but I am coding this to learn, not necessarily to market an application. Although if I were to develop it enough I would not be opposed to monetizing it someday.

What I've done so far: The first thing I wanted to make sure I could do was to drag and drop an image in a window. I figured if I can just write something to make that one thing work, then I can move on to whatever next function I needed to make the vision complete. Tkinter is a basic library for Python so I figured I would just start there. Through searching a few things I found a decent YouTube video series from codemy.com. One of his videos showed how to drag and drop an image. An issue I found with the way it is coded is that it basically creates a brand new image every time it moves (at least that's how I am understanding it). While I realize the final solution I found might technically do the same thing, I still needed the image to be an object of my own creation. Then I could put all the objects in a list and serialize certain attributes of the object to save them (Pickle might just be my next post). It also moved the image to wherever was clicked. I needed it to work so that it would only move when that particular image was clicked. After a decent amount of searching I finally came across something that worked!

The first few lines are part of the initialization of the object, but the two functions in the snippet of the code will actually drag the object only when clicked and stop moving it when the mouse button is released. I admittedly don't fully understand how it works quite yet.

I believe the canvas.tag_bind binds the actual object to the mouse event and runs the code. Although I don't exactly understand what tag_bind does, it does seem to work fine. I am satisfied with how this part turned out. I just wanted to make the one thing work. Then I wanted to be able to save the locations of the images (I wanted to try this without a database). Then I could make a floor plan/blueprint and put that on the canvas. Then I would work on saving that in it's own folder. Next I want to be able to delete a device(image) or move it to a different floor plan, etc. Stay tuned for more progress on this!

25 Words or Less: You cannot write a whole program at once. Break it down and focus on completing one function, then continue to the next.