石英 2D 锯齿线

Posted 2023-03-12

【中文标题】石英 2D 锯齿线

【英文标题】：Quartz 2D jagged lines

【发布时间】：2014-04-05 19:31:16

【问题描述】：

查看我的绘画应用程序产生的这条奇怪的路径：

中间的红线是调试功能，代表输入鼠标移动和它们之间的距离，线宽为 1 px，黑色是输出，线宽为 30 px。

我绘制这个的方式很简单，只是合并鼠标事件之间的点对点：

//This is called in mouseDragged: and [theEvent locationInWindow] is passed to point
-(void)addPointToCurrentStroke:(CGPoint)point 

if (self.newStroke == TRUE) //If the currentStroke doesn't exist or is empty

   self.currentStroke = CGPathCreateMutable();
   CGPathMoveToPoint(self.currentStroke, NULL, point.x, point.y);
   self.newStroke = FALSE;


else if (self.newStroke == FALSE)
    CGPathAddLineToPoint(self.currentStroke, NULL, point.x, point.y);

然后使用适当的用户设置在 drawRect: 中描边该路径，在本例中为 30 大小和黑色。请注意圆形线帽，这使得它像那样突出更奇怪。

那么，为什么这些尖刺会从预期的路径伸出这么远呢？我无法对它做出正面或反面。如果有人能告诉我这里发生了什么，我将不胜感激。

【问题讨论】：

类似问题："Joined lines at certain angles have pointed vertexes instead of rounded"、"UIBezierPath round edges?"。

【参考方案1】：

您的 CG 上下文设置为在路径的每个角落使用斜接。当那个角落有一个小角度时，斜接可以伸出很远的距离。请改用CGContextSetLineJoin 指定圆形连接或斜角连接。

请参阅Quartz 2D Programming Guide, "Parameters That Affect Stroking"。

【讨论】：

感激不尽！现在我的台词终于看起来正常了……我可以继续做更令人兴奋的事情了！