如何用C#的DrawArc与DrawLine绘制可旋转自定义形状？（教学用）

针对教学场景，我们可以通过GDI+的DrawArc和DrawLine方法实现支持旋转、中心点调整、最大/最小范围修改的自定义形状，以下是具体实现方案：

核心逻辑分析 #

目标形状由4部分组成：

• 外圆弧：半径为MaxRange，对应最大范围
• 内圆弧：半径为MinRange，对应最小范围
• 两条直线：分别连接内外圆弧的两个端点
  旋转功能通过调整圆弧的起始角度实现，所有计算基于中心点的极坐标转换。

关键代码实现 #

1. 定义形状参数 #

先定义控制形状的核心参数，方便教学时调整演示：

// 形状核心参数
private PointF _center = new PointF(200, 200); // 中心点
private float _maxRange = 150; // 最大范围（外圆弧半径）
private float _minRange = 80; // 最小范围（内圆弧半径）
private float _startAngle = 30; // 起始角度（控制旋转，0度为x轴正方向）
private float _sweepAngle = 120; // 扇形扫过的角度

2. 绘制方法实现 #

在WinForm的OnPaint事件中编写绘制逻辑，或者封装为独立方法：

protected override void OnPaint(PaintEventArgs e)
{
    base.OnPaint(e);
    var g = e.Graphics;
    g.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.AntiAlias; // 抗锯齿，让线条更顺滑
    var pen = new Pen(Color.Black, 2);

    // 角度转换：GDI+用度数，数学计算转弧度
    float startRadian = _startAngle * (float)Math.PI / 180;
    float endRadian = (_startAngle + _sweepAngle) * (float)Math.PI / 180;

    // 计算4个关键端点（极坐标转笛卡尔坐标）
    // 外圆弧起点
    PointF outerStart = new PointF(
        _center.X + _maxRange * (float)Math.Cos(startRadian),
        _center.Y + _maxRange * (float)Math.Sin(startRadian)
    );
    // 外圆弧终点
    PointF outerEnd = new PointF(
        _center.X + _maxRange * (float)Math.Cos(endRadian),
        _center.Y + _maxRange * (float)Math.Sin(endRadian)
    );
    // 内圆弧起点
    PointF innerStart = new PointF(
        _center.X + _minRange * (float)Math.Cos(startRadian),
        _center.Y + _minRange * (float)Math.Sin(startRadian)
    );
    // 内圆弧终点
    PointF innerEnd = new PointF(
        _center.X + _minRange * (float)Math.Cos(endRadian),
        _center.Y + _minRange * (float)Math.Sin(endRadian)
    );

    // 绘制外圆弧：参数依次是Pen、外接矩形、起始角度、扫过角度
    g.DrawArc(pen, 
        _center.X - _maxRange, _center.Y - _maxRange, // 外接矩形左上角X/Y
        _maxRange * 2, _maxRange * 2, // 外接矩形宽高（直径）
        _startAngle, _sweepAngle);

    // 绘制内圆弧
    g.DrawArc(pen,
        _center.X - _minRange, _center.Y - _minRange,
        _minRange * 2, _minRange * 2,
        _startAngle, _sweepAngle);

    // 绘制连接直线
    g.DrawLine(pen, outerStart, innerStart);
    g.DrawLine(pen, outerEnd, innerEnd);

    pen.Dispose();
}

3. 参数调整与重绘 #

教学时可以通过按钮、滑块等控件修改参数，调用Invalidate()触发重绘，比如：

// 示例：点击按钮旋转形状
private void btnRotate_Click(object sender, EventArgs e)
{
    _startAngle += 15; // 每次旋转15度
    if (_startAngle >= 360) _startAngle -= 360;
    Invalidate(); // 重绘界面
}

// 示例：调整最大范围
private void trackBarMaxRange_Scroll(object sender, EventArgs e)
{
    _maxRange = trackBarMaxRange.Value;
    // 确保最大范围大于最小范围
    if (_maxRange <= _minRange) _maxRange = _minRange + 10;
    Invalidate();
}

教学要点说明 #

• 极坐标转笛卡尔坐标：这是计算端点的核心，要给学生讲清楚角度与坐标的对应关系
• DrawArc参数解析：外接矩形的作用是确定圆弧的边界，宽高必须是半径的2倍
• 旋转原理：修改起始角度即可让整个形状绕中心点旋转，本质是改变所有端点的起始极角
• 参数约束：要确保MaxRange大于MinRange，避免形状异常

内容的提问来源于stack exchange，提问作者Saba system