在 swift 中绘制圆弧时的额外线条

Question

我在 swift 应用程序中有这种代码，我得到一条额外的灰色线到达弧的起点。圆弧本身按预期绘制，但似乎 CGContextMoveToPoint 在到达起点之前留下了一些痕迹。

override func drawRect(rect: CGRect) {
    var context:CGContextRef = UIGraphicsGetCurrentContext();

    var centerX,centerY,startAngle,endAngle,radius:CGFloat
     startAngle = CGFloat(M_PI_4)
    endAngle = -startAngle
    radius = (rect.height/2) / sin(startAngle)
    centerX = rect.width/2 + (radius*cos(startAngle))
    centerY = rect.height/2
    CGContextMoveToPoint(context, rect.width/2, rect.height)
    CGContextAddArc(context,centerX,centerY,radius,startAngle,endAngle,0);
    CGContextSetLineWidth(context, 3.0)
    CGContextSetStrokeColorWithColor(context, UIColor.lightGrayColor().CGColor)
    CGContextStrokePath(context)
}

知道哪里出了问题吗？

Answer 1

这是CGContextAddArc的一个特点。来自文档：

If the current path already contains a subpath, Quartz adds a line connecting the current point to the starting point of the arc. If the current path is empty, Quartz creates a new new subpath with a starting point set to the starting point of the arc.

通过移动到一个点，您已经建立了路径的起点。如果您删除 CGContextMoveToPoint()，您的弧线将在没有额外线的情况下绘制。

或者，您可以移动到圆弧的起点：

CGContextMoveToPoint(context, centerX + radius*cos(startAngle), centerY + radius*sin(startAngle))

更新

（编者注：我在@Michel 弄清楚问题后添加了这一点。这也许是我在评论中经过一些讨论后应该给出的答案。在这里提供它可能会在将来帮助其他人） .

你的整个圆弧看起来像字母 c，但只有一部分在视图中可见（给定上面的代码）。额外的线是从视图底部的中间绘制到屏幕外的 c 曲线的下端。

如果您只想要视图中的弧线部分，那么您的起始角度应该是 3 * M_PI_4 并且您的 centerX 计算需要使用 - 而不是+:

override func drawRect(rect: CGRect) {
    var context:CGContextRef = UIGraphicsGetCurrentContext();

    var centerX,centerY,startAngle,endAngle,radius:CGFloat
    startAngle = 3 * CGFloat(M_PI_4)
    endAngle = -startAngle
    radius = (rect.height/2) / sin(startAngle)
    centerX = rect.width/2 - (radius*cos(startAngle))
    centerY = rect.height/2
    CGContextMoveToPoint(context, rect.width/2, rect.height)
    CGContextAddArc(context,centerX,centerY,radius,startAngle,endAngle,0);
    CGContextSetLineWidth(context, 3.0)
    CGContextSetStrokeColorWithColor(context, UIColor.lightGrayColor().CGColor)
    CGContextStrokePath(context)
}

然后，您的起点将在视图中，不会出现额外的线。

在 swift 中绘制圆弧时的额外线条

Extra line when drawing an arc in swift

graphics

cgcontext

ios

swift