c# - 在 PictureBox 上绘制折线

Question

我想在PictureBox.

在这种情况下，我们可以通过指定每条线段的端点来创建多条线，并计算每条线段的距离，即每条线的距离。

Answer 1

如果您想在图片框上执行此操作，最简单的方法是从 a 继承您自己的控件，PictureBox并提供当您将鼠标悬停在图片框上时添加端点的功能。

然后，您将鼠标单击的位置存储在列表中，并覆盖OnPaint以绘制端点（我选择了 4x4 正方形）和每个端点之间的线。这是基本代码：

public class EndPointPictureBox : PictureBox
{
    private List<PointF> points = new List<PointF>();
    public EndPointPictureBox()
    {
    }

    protected override void OnMouseDown(MouseEventArgs e)
    {
        points.Add(new PointF(e.X,e.Y));
        base.OnMouseDown(e);
        this.Invalidate();
    }

    protected override void OnPaint(PaintEventArgs pe)
    {
        base.OnPaint(pe);

        Graphics g = pe.Graphics;
        foreach(var point in points)
            g.DrawRectangle(Pens.Black,point.X-2.0f,point.Y-2.0f,4.0f,4.0f);
        if(points.Count>1)
            g.DrawLines(Pens.Black,points.ToArray());

    }
}

您现在可以像 PictureBox 一样将其添加到 Form 中，并选择您的图像以通常的方式进入其中。

如果您尝试在图片框内单击几次，您会看到它会像您的示例图像一样绘制您的端点。这是我机器上的一个例子：

然后你的下一个要求，获取端点之间的距离。这可以通过添加一个类来表示一个EndPoint并引用其隔壁邻居来完成。然后是一些简单的毕达哥拉斯数学来获得当前点和下一个点之间的距离：

public class EndPoint
{
    public EndPoint(int index, List<PointF> points)
    {
        this.Position = points[index];
        if (index < points.Count - 1)
            this.Next = points[index + 1];
    }
    public PointF Position { get; private set; }
    public PointF Next { get; private set; }

    public double GetDistanceToNext()
    {
        if(this.Next == PointF.Empty)
            return 0;

        var xDiff = this.Position.X - Next.X;
        var yDiff = this.Position.Y - Next.Y;

        return Math.Abs(Math.Sqrt((xDiff*xDiff) + (yDiff*yDiff)));
    }
}

您可以向新的 PictureBox 添加一个方法来获取以下列表：

public List<EndPoint> GetEndPoints()
{
    var list = new List<EndPoint>();
    for(var i=0;i<points.Count;i++)
        list.Add(new EndPoint(i,points));
    return list;
}