CODEWITHSUNDEEP
c#pictureboxpanning
Umaima B
Umaima B

Reputation: 11

Panning Image in pictureBox not working

I have developed windows application in c# where I have a pictureBox inside a panel. I have applied zoom in and zoom out functionality in it. Now I want the image inside the pictureBox to pan. I have applied mouseDown, mouseMove and mouseUp event on pictureBox. The code for it is:

private void pictureBox2_MouseDown(object sender, MouseEventArgs e)
{
   if (pflag == 1)
   {
       dragging = true;
       start = e.Location;
   }
}

private void pictureBox2_MouseMove(object sender, MouseEventArgs e)
{
    // panning code
    if (pflag == 1)
    {
        if (dragging && zoom == 1)
        {
             pictureBox2.Location = new Point(pictureBox2.Left + (e.Location.X - start.X), pictureBox2.Top + (e.Location.Y - start.Y));
        }
    }
}

private void pictureBox2_MouseUp(object sender, MouseEventArgs e)
{ 
    if (pflag == 1)
    {
        dragging = false;
    }
}

Here the image is panning but with no boundary control. Sometimes even the image goes below the panel area while panning. What I need here is, image should move top, left , right, bottom according to zoom factor i.e like how scroll bar works and not beyond that.

Upvotes: 0

Views: 754

Answers (1)

TaW
TaW

Reputation: 54433

You don't need to worry about zoom as the mouse coordinates will be fine as they are. The distance of the shown pixels should be the same as those the cursor is moving..

You also do not really need the dragging variable, unless you use it for something else.

However you do need to check the mouse button during the MouseMove:

    if (pflag == 1  && e.Button == System.Windows.Forms.MouseButtons.Left  )

Do note few things:

  • The user expects that the spot he drags stays with the mouse cursor just as the pixel he touches should always move with the fingertip. Do not surprise him by scaling in the zoom-factor!

  • If you wanted to do that you would need to use a factor, not adding an number.

  • Yes, the scrollbars will factor in the zoom but also the lift will still stay with the mouse!

Here is an example of how to set limits to prevent the user from going too far. It it a little involved because it needs to work when zoomed in or out. Do not start with illegal positions, though, nor get into those while zooming!

//  panning code
if ( pflag == 1 && e.Button == System.Windows.Forms.MouseButtons.Left  )
{
    {
        Rectangle panRect = new Rectangle(panel1.Location, panel1.ClientSize);
        Rectangle picRect = new Rectangle(pictureBox2.Location, pictureBox2.ClientSize);
        int newLeft = pictureBox2.Left + (e.Location.X - start.X);
        int newTop = pictureBox2.Top + (e.Location.Y - start.Y);
        int newRight = newLeft + picRect.Width;
        int newBottom = newTop + picRect.Height;

        if ((newLeft < 0 && newRight < panRect.Width)
        || (newLeft > 0 /*&& newRight > panRect.Width */)) newLeft = picRect.Left;

        if ((newTop < 0 && newBottom < panRect.Width)
        || (newTop > 0 /*&& newBottom > panRect.Height*/)) newTop = picRect.Top;

        pictureBox2.Location = new Point(newLeft, newTop);
    }
    Text = "" + pictureBox2.Location;
}

Note the two parts I have commented out! As it is you can't move a picture that is smaller than the viewport; you can allow it by removing the comments but should then take care when zooming in to move it up and left to zero as it should never sit in the positve range and also overlap or else the scrollbars will behave in a weird way..!

Upvotes: 0

Related Questions