How to scroll a tkinter canvas to an absolute position?

Question

I’m using Python and tkinter. I have a Canvas widget that will display just one image. Most times the image will be larger than the canvas dimensions, but sometimes it will be smaller. Let’s just focus on the first case (image larger than canvas).

I want to scroll the canvas to an absolute position that I have already calculated (in pixels). How can I do that?

Asked By: Denilson Sá Maia

||

Source

Answer 1

This is what I have already done:

# Little hack to scroll by 1-pixel increments.
oldincx = self.canvas["xscrollincrement"]
oldincy = self.canvas["yscrollincrement"]
self.canvas["xscrollincrement"] = 1
self.canvas["yscrollincrement"] = 1
self.canvas.xview_moveto(0.0)
self.canvas.yview_moveto(0.0)
self.canvas.xview_scroll(int(scroll_x)+1, UNITS)
self.canvas.yview_scroll(int(scroll_y)+1, UNITS)
self.canvas["xscrollincrement"] = oldincx
self.canvas["yscrollincrement"] = oldincy

But… As you can see… it’s very hackish and ugly. To much workaround for something that should be simple. (plus that magic +1 I was required to add, or it would be off-by-one)

Does anyone else have another better and cleaner solution?

Answered By: Denilson Sá Maia

Answer 2

After trying for around half hour, I got another solution that seems better:

self.canvas.xview_moveto(float(scroll_x+1)/img_width)
self.canvas.yview_moveto(float(scroll_y+1)/img_height)

img_width and img_height are the dimensions of the image. In other words, they are the full scrollable area.
scroll_x and scroll_y are the coordinates of the desired top-left corner.
+1 is a magic value to make it work precisely (but should be applied only if scroll_x/y is non-negative)
Note that the current widget dimension is not needed, only the dimension of the contents.

This solution works very well even if the image is smaller than the widget size (and thus the scroll_x/y can be negative).

EDIT: improved version:

offset_x = +1 if scroll_x >= 0 else 0
offset_y = +1 if scroll_y >= 0 else 0
self.canvas.xview_moveto(float(scroll_x + offset_x)/new_width)
self.canvas.yview_moveto(float(scroll_y + offset_y)/new_height)

Answered By: Denilson Sá Maia

Answer 3

In tkinter you can get the width and height of a PhotoImagefile. You can just call it when you use canvas.create_image

imgrender = PhotoImage(file="something.png")
##Other canvas and scrollbar codes here...
canvas.create_image((imgrender.width()/2),(imgrender.height()/2), image=imgrender)
## The top left corner coordinates is (width/2 , height/2)

Answered By: Paaksing

Answer 4

I found this solution by using self.canvas.scan_dragto(x, y)

Edit: I develop an interface which can scroll, zoom, and rotate an image. Let’s extract from my interface the code.

When I want to save the current position of image I use this:

# 1) Save image position
x0canvas = -self.canvas.canvasx(0)
y0canvas = -self.canvas.canvasy(0)
x0, y0 = self.canvas.coords(text)
ximg = x0
yimg = y0

# 2) Restore image position (for example: after a load)
self.text = canvas.create_text(ximg, yimg, anchor='nw', text='')
self.xyscroll(x0canvas, y0canvas) 

# Rotate and zoom image 
image = Image.open('fileImg.jpg')
..
imageMod = image.resize(new_size)
if rotate != 0:
    imageMod = imageMod.rotate(rotate)
imagetk = ImageTk.PhotoImage(imageMod)
imageid = canvas.create_image(canvas.coords(text), anchor='nw', image=imagetk)

Answered By: JP P

How to scroll a tkinter canvas to an absolute position?

Question:

Answers: