You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

如何绘制平行四边形组成的线条?解决OnPaint仅支持矩形绘制的问题

实现平行四边形组成的线条解决方案

嘿,我明白你想实现由平行四边形组成的线条,但目前用DrawRectangles只能画出直角矩形对吧?别担心,这里有两种简单的方法来修改你的代码,轻松搞定!

方案1:直接定义平行四边形顶点

这种方法不需要依赖变换,手动构造每个平行四边形的四个顶点,能精准控制形状:

protected override void OnPaint(PaintEventArgs e)
{
    base.OnPaint(e);
    // 定义每个平行四边形的顶点数组(顺序:左上→右上→右下→左下)
    Point[][] parallelograms = new Point[][]
    {
        // 基于原矩形向右倾斜20像素,可调整偏移量改变倾斜程度
        new Point[] { new Point(0, 0), new Point(120, 0), new Point(220, 30), new Point(100, 30) },
        new Point[] { new Point(120, 0), new Point(240, 0), new Point(340, 30), new Point(220, 30) },
        new Point[] { new Point(240, 0), new Point(360, 0), new Point(460, 30), new Point(340, 30) },
        new Point[] { new Point(360, 0), new Point(480, 0), new Point(580, 30), new Point(460, 30) },
        new Point[] { new Point(480, 0), new Point(600, 0), new Point(700, 30), new Point(580, 30) }
    };

    // 绘制所有平行四边形
    e.Graphics.DrawPolygons(new Pen(Color.Black, 1), parallelograms);
}

方案2:使用矩阵倾斜变换(复用原矩形逻辑)

如果你想保留原来的Rectangle数组,只需要通过矩阵剪切变换把矩形转换成平行四边形,修改成本极低:

protected override void OnPaint(PaintEventArgs e)
{
    base.OnPaint(e);
    Rectangle[] rectangles = new Rectangle[]
    {
        new Rectangle(0, 0, 100, 30),
        new Rectangle(100, 0, 100, 30),
        new Rectangle(200, 0, 100, 30),
        new Rectangle(300, 0, 100, 30),
        new Rectangle(400, 0, 100, 30),
    };

    // 保存原始绘图变换,避免影响后续操作
    var originalTransform = e.Graphics.Transform;

    // 创建剪切变换矩阵:第一个参数是水平倾斜量(正数向右倾,负数向左倾),第二个是垂直倾斜量
    using (Matrix shearMatrix = new Matrix())
    {
        shearMatrix.Shear(0.2f, 0);
        e.Graphics.Transform = shearMatrix;

        // 绘制经过倾斜的矩形,此时它们会变成平行四边形
        e.Graphics.DrawRectangles(new Pen(Color.Black, 1), rectangles);
    }

    // 恢复原始变换
    e.Graphics.Transform = originalTransform;
}

两种方法都能实现你想要的效果:方案2更适合批量生成或灵活调整倾斜程度的场景,方案1则适合需要精准控制每个平行四边形形状的情况。

内容的提问来源于stack exchange,提问作者Héctor M.

火山引擎 最新活动