How to pan an image with the mouse in Delphi 2010(VCL)

Question

I have a TImage component in a ScrollBox, where the image is larger than the ScrollBox. I can use the scroll bars to move the image around in the ScrollBox, but I want to use the mouse. I want to click on the image and drag it to move it in the ScrollBox. As I do this, the ScrollBox's scroll bars should move correspondingly.

I am going to set the image cursor to crHandPoint so that people will expect that they can move the image around.

My question is, how do I make this work?

procedure TfrmKaarte.imgKaartCanvasMouseDown(Sender: TObject;
Button: TMouseButton; Shift: TShiftState; X, Y: Integer);
begin
  bPanning:=True;
  pt := Mouse.CursorPos;
end;

procedure TfrmKaarte.imgKaartCanvasMouseMove(Sender: TObject;
Shift: TShiftState; X, Y: Integer);
begin
  if bPanning=True then
  begin
    imgKaartCanvas.Left:=X+imgKaartCanvas.Left-pt.X;
    imgKaartCanvas.Top:=Y+imgKaartCanvas.Top-pt.Y;
  end;
end;

procedure TfrmKaarte.imgKaartCanvasMouseUp(Sender: TObject;
Button: TMouseButton; Shift: TShiftState; X, Y: Integer);
begin
  bPanning:=False;
end;

With some fancy slowing down effect here https://stackoverflow.com/q/9464316/8041231. — Victoria, Jul 10 '18 at 08:59
Rather than moving the image in mouseMove, why not move the scroll bars instead, and let them move the image, which in a scroll box, is what they are designed to do. — Dsm, Jul 10 '18 at 10:17
@Dsm, that's what author of that answer is actually doing (see `TForm1.SetScrollPos`). You can drop all that timer stuff from there and you'll get a solution for this question. But with no effect which looks boring :) — Victoria, Jul 10 '18 at 14:18
@Victoria 's solution helped a lot.(Solved the problem anyway) https://stackoverflow.com/q/9464316/8041231 — Janrich, Jul 11 '18 at 08:50

score 1 · Answer 1 · answered Apr 13 '23 at 08:07

A very simple working code which I've written in Delphi 10 Seatle is as follows:

procedure TForm1.imgImageMouseDown(Sender: TObject; 
  Button: TMouseButton; Shift: TShiftState; X, Y: Integer);
begin
  FPanning := True;
  with sbScrollBox do
    FScrollPos.SetLocation(HorzScrollBar.Position, VertScrollBar.Position);
  FMousePos := Mouse.CursorPos;
end;

procedure TForm1.imgImageMouseMove(Sender: TObject; 
  Shift: TShiftState; X, Y: Integer);
begin
  if FPanning then
    with sbScrollBox do
    begin
      HorzScrollBar.Position := FScrollPos.X + FMousePos.X - Mouse.CursorPos.X;
      VertScrollBar.Position := FScrollPos.Y + FMousePos.Y - Mouse.CursorPos.Y;
    end;
end;

procedure TForm1.imgImageMouseUp(Sender: TObject;
  Button: TMouseButton; Shift: TShiftState; X, Y: Integer);
begin
  FPanning := False;
end;

Don't forget to define these variables:

FPanning: Boolean;
FScrollPos: TPoint;
FMousePos: TPoint;

in the private section of your form class and initialize the FPanning to False.

Hope that it helps.

How to pan an image with the mouse in Delphi 2010(VCL)

1 Answers1