如何在C#窗体中绘制Zoomable图像

时间:2015-02-20 16:15:15

标签: c# winforms graphics zoom line

所以我正在实现一个可以读取图像的项目,缩放它并做其他事情......一切顺利,直到我尝试用鼠标右键实现绘图。

问题是当我画一条线时,图像上出现的线与我在屏幕上画出的线不对应,这意味着它被移动了,我知道它因为图像的重新调整大小和缩放,但是当我在图像上绘制原始大小(图像)和平移时的线条;我没问题。

这是代码。

首先,我点击浏览并选择图像

时如何加载图像
Myimage = new Bitmap(ImagePath);
resized = myImage.Size;
imageResize();
pictureBox.Paint += new    System.Windows.Forms.PaintEventHandler(this.pictureBox_Paint);
                pictureBox.Invalidate();

imageResize函数执行以下操作:

void imageResize()
{     
//calculated the size to fit the control i will draw the image on   
 resized.Height = someMath;
 resized.Width = someMath;
}

然后在pictureBox_Paint事件的事件处理程序中写道:

private void pictureBox_Paint(object sender,      System.Windows.Forms.PaintEventArgs e)
{
// Create a local version of the graphics object for the PictureBox.
Graphics PboxGraphics = e.Graphics;
PboxGraphics.DrawImage(myImage, imageULcorner.X, imageULcorner.Y,     resized.Width, resized.Height);
}

正如你可以看到调整大小不是原始图像大小我做了这个因为我希望图像显示在图片框控件上集中并填充现在下一部分是我的问题开始

我必须使用鼠标右键在图像上画线,所以我实现了pictureBox_MouseDown& pictureBox_MouseUp事件处理程序

// mouse down event handler
private void pictureBox_MouseDown(object sender, MouseEventArgs e)
{
else if (mouse.Button == MouseButtons.Right)
{
mouseDown = mouse.Location;
mouseDown.X = mouseDown.X - imageULcorner.X;
mouseDown.Y = mouseDown.Y - imageULcorner.Y;
draw = true;
}
}

这里是鼠标向上事件处理程序

//Mouse UP
private void pictureBox_MouseUp(object sender, MouseEventArgs e)
{
else if (mouse.Button == MouseButtons.Right)
{
if (draw)
 {
mouseLocationNow.X = mouse.X - imageULcorner.X;
mouseLocationNow.Y = mouse.Y - imageULcorner.Y;
//
// get graphics object of the image ( the original not the resized)
// as the resized image only appears when i draw on the graphics of the
// pictureBox control
// i know the problem lies here but how can i fix it
//
Graphics image = Graphics.FromImage(myImage);
Pen pen = new Pen(Color.Red, 2);
image.DrawLine(pen, mouseLocationNow, mouseDown);
pictureBox.Invalidate();
}
draw = false;
}

所以最后我希望能够在重新调整大小的图像上绘制并使其对应于真实图像,并且还可以对应于我绘制线条的屏幕 感谢和抱歉长篇文章,但这个问题一直让我发疯。

1 个答案:

答案 0 :(得分:2)

这是一个PictureBox子类,它不仅支持将缩放应用于Image,还可以应用于绘制到其表面的图形。

它包含一个SetZoom函数,可以通过缩放自身和矩阵进行放大。

它还有一个ScalePoint函数,您可以使用它从鼠标事件中收到的像素坐标计算未缩放的坐标。

我们的想法是使用Transformation Matrix来缩放Graphics对象在Paint事件中绘制的任何像素。

我为表单提供了一些代码以供测试。

public partial class ScaledPictureBox : PictureBox
{
    public Matrix ScaleM { get; set; }

    float Zoom { get; set; }
    Size ImgSize { get; set; }

    public ScaledPictureBox()
    {
        InitializeComponent();
        ScaleM = new Matrix();
        SizeMode = PictureBoxSizeMode.Zoom;
    }

    public void InitImage()
    {
        if (Image != null)
        {
            ImgSize = Image.Size;
            Size = ImgSize;
            SetZoom(100);
        }
    }

    public void SetZoom(float zoomfactor)
    {
        if (zoomfactor <= 0) throw new Exception("Zoom must be positive");
        float oldZoom = Zoom;
        Zoom = zoomfactor / 100f;
        ScaleM.Reset();
        ScaleM.Scale(Zoom , Zoom );
        if (ImgSize != Size.Empty) Size = new Size((int)(ImgSize.Width * Zoom), 
                                                   (int)(ImgSize.Height * Zoom));

    }

    public PointF ScalePoint(PointF pt)
    {   return new PointF(pt.X / Zoom , pt.Y / Zoom );     }

}

以下是执行测试的表单中的代码:

public List<PointF> somePoints = new List<PointF>();

private void scaledPictureBox1_MouseClick(object sender, MouseEventArgs e)
{
    somePoints.Add(scaledPictureBox1.ScalePoint(e.Location) );
    scaledPictureBox1.Invalidate();
}

private void scaledPictureBox1_Paint(object sender, PaintEventArgs e)
{
    // here we apply the scaling matrix to the graphics object:
    e.Graphics.MultiplyTransform(scaledPictureBox1.ScaleM);
    using (Pen pen = new Pen(Color.Red, 10f))
    {
        PointF center = new PointF(scaledPictureBox1.Width / 2f, 
                                   scaledPictureBox1.Height / 2f);
        center = scaledPictureBox1.ScalePoint(center);
        foreach (PointF pt in somePoints)
        {
            DrawPoint(e.Graphics, pt, pen);
            e.Graphics.DrawLine(Pens.Yellow, center, pt);
        }
    }
}

public void DrawPoint(Graphics G, PointF pt, Pen pen)
{
    using (SolidBrush brush = new SolidBrush(pen.Color))
    {
        float pw = pen.Width;
        float pr = pw / 2f;
        G.FillEllipse(brush, new RectangleF(pt.X - pr, pt.Y - pr, pw, pw));
    }
}

以下是绘制几个点后显示四个不同缩放设置中相同点的结果; ScaledPictureBox显然位于AutoScroll-Panel。这些行显示了如何使用常规绘图命令..

enter image description here enter image description here enter image description here enter image description here