Having difficulty dragging a Rect on a resized Canvas

I’m running into a problem that I can’t get my head around and I hope that someone has seen this before and can help with some suggestions.

Here’s a some background: What I’ve got is a canvas control that has a width of 800 and a height of 700 and a vertical scrollbar alongside the canvas of the same height. I’ve drawn several REALbasic.Rect controls. The Rect controls can only be dragged vertically and when any are dragged, the rest remain the same distance apart - so far this all works as expected.

Here’s where I’m having the trouble. Let’s say I have three Rect controls at Y coordinates of 100, 250 and 400. If I drag the Rect at Y-100 down to the bottom of the visible canvas, I increase the height of the canvas by the 700 pixels that I’ve drug it and the other two Rects are repositioned accordingly within the resized canvas. Now if I use the scrollbar to scroll the canvas down and get the original Rect which was at Y-400 in approximately the same visual position and try to drag that Rect - no dragging occurs with my existing code. What I’m having the trouble understanding is that the MouseDrag event is firing twice. I’m converting the X,Y values passed into the event into a Point and what I’m seeing is that the first time the MouseDrag fires Y is 400’ish and the second time MouseDrag fires Y is 131000’ish. What I expected was only one MouseDrag to fire and that the Y value would be 1200’ish since my canvas was resized from a height of 800 to 1500 by the first drag.

Any ideas?


MouseDrag fires every time the mouse is MOVED, assuming MOUSEDOWN has fired
if MOUSEDOWN has not fired, the MOUSEMOVE fires whenever the mouse is moved.

So if you drag the mouse across the screen. MOUSEDRAG will fire hundreds of times

Sounds like you are stacking you calculations up, instead of using the DELTA from where MOUSEDOWN happened, and the particular MOUSEDRAG is occuring.

That all makes sense and setting breakpoints in those events does cause the breakpoint to fire a lot. If you think of my resized canvas as the original region and then region two. As soon as I scroll the canvas down to region two my dragging logic doesn’t work. If I scroll the canvas back up to the original region my dragging logic works again. I’m hoping for some pointers on how to deal with that in my code.

Can you show some code?

It sounds like you’re not accounting for offsets somewhere.

Will - thanks for the idea about the offsets. I’m going to try a few more things myself now (hopefully learn something in the process). If I’m still stuck later I will post my code.

It seems like two things:

  1. Are you actually moving the canvas object or just the internal objects offsets when you adjust the scrollbar?

  2. a) Capture the offset of the mouse location and the object location on mouse down.
    b) Use that offset in the mouse drag event to re-locate the object, based upon the mouse position.