核心图形用轮廓画线答案

【问题标题】：Core Graphics draw line with outline核心图形用轮廓画线
【发布时间】：2012-01-22 09:50:03
【问题描述】：

我正在使用 Core Graphics 绘制一条宽度为 4 像素的任意线，现在我希望这条线具有另一种颜色的 1 像素轮廓。我看不到任何可以实现“开箱即用”的 CG 功能，但我正在寻找有关如何完成的建议。这是我现有的代码：

CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSetLineWidth(context, 4.0);

CGPoint curPoint = [(NSValue*)[points objectAtIndex:0] CGPointValue];
CGContextMoveToPoint(context, curPoint.x, curPoint.y);

for( int i = 1; i < [points count]; i++ ) {
    curPoint = [(NSValue*)[points objectAtIndex:i] CGPointValue];
    CGContextAddLineToPoint(context, curPoint.x, curPoint.y);
    CGContextStrokePath(context);
    CGContextMoveToPoint(context, curPoint.x, curPoint.y);
}

这会产生单行。我想生成一条 4px 线，其中 1px 线突出显示 4px 线，如下所示：

【问题讨论】：

标签： iphone cocoa-touch core-graphics

【解决方案1】：

iOS 5.0 添加了一个新功能CGPathCreateCopyByStrokingPath()，可以满足您的需求。

首先为黑色路径创建一个CGPathRef，然后使用CGPathCreateCopyByStrokingPath() 创建它的副本。

这会给你一个新的路径，你可以用黑色填充，用红色描边，得到你想要的。

另外，创建路径有点慢。您应该避免在执行屏幕绘制时创建路径。您的所有路径都应存储在 RAM 中并准备好在您开始绘制到屏幕之前。 drawRect: 应该只绘制路径，而不是创建它。

【讨论】：

【解决方案2】：

类似于 Abhi Beckert 的建议，但您可以使用此功能：

CGContextReplacePathWithStrokedPath(CGContextRef c);

这也存在于旧版 SDK 中 - 例如 iOS 4.1、MacOS X 10.6。
此外，最好创建整个路径，然后在最后对其进行描边（或同时描边并填充） - 换句话说，循环内不需要 CGContextStrokePath。

【讨论】：

【解决方案3】：

恐怕您将不得不将线宽设置为 1 再次绘制路径。如果您希望它位于 4 像素路径之外，则必须相应地调整路径。

编辑：我想到了另一种选择 - 你可以画出一个图案 - 请参阅 Apple 的 QuartzDemo 以获取示例。

【讨论】：

我就是这么想的。我可以弄清楚这条线是垂直还是水平，但它是一条任意线，可以以任何形状向任何方向移动，所以我不确定如何计算正确的位置。
我需要更好地了解您实际想要做什么。你能发布几个示例图片吗？
它实际上是用户手绘的，所以它绝对可以是任何形状。
当然，我明白这一点，但我不明白效果应该是什么。插图会有所帮助。
我认为这可能会有所帮助：wiggler.gr/2011/09/12/function-to-create-a-paths-outline

【解决方案4】：

要为我自己的问题添加答案，可以通过在突出显示颜色中画一条宽几个像素的线，然后在顶部画一条实际线来完成。这会产生轮廓效果。

【讨论】：

【解决方案5】：

没有一种内置方法可以将笔画转换为路径，然后再对该路径进行描边。也就是说，您可以通过两次绘制线条来近似此值：一次使用 6 像素笔画（每边 4 像素 + 1），然后再次使用不同颜色的 4 像素笔画

类似于：

CGContextRef context = UIGraphicsGetCurrentContext();

CGPoint curPoint = [(NSValue*)[points objectAtIndex:0] CGPointValue];
CGContextMoveToPoint(context, curPoint.x, curPoint.y);

for( int i = 1; i < [points count]; i++ ) {
    curPoint = [(NSValue*)[points objectAtIndex:i] CGPointValue];
    CGContextAddLineToPoint(context, curPoint.x, curPoint.y);
}

// Set your 1 pixel highlight color here using CGContextSetRGBStrokeColor or equivalent
// CGContextSetRGBStrokeColor(...)
CGContextSetLineWidth(context, 6.0);
CGContextStrokePath(context);


// Set your 4 pixel stroke color here using CGContextSetRGBStrokeColor or equivalent
// CGContextSetRGBStrokeColor(...)
CGContextSetLineWidth(context, 4.0);
CGContextStrokePath(context);

另一个想法是在绘制描边之前通过 CGContextSetShadowWithColor(context, CGSizeZero, 1.0, yourHighlightColorHere) 设置阴影，尽管这不会以完全不透明度绘制高亮颜色。（我也不记得 shadows 属性是否为阴影描边 - 我只将它们与填充一起使用）

【讨论】：

我接受 Abhi 的纠正 - 看起来 CGPathCreateCopyByStrokingPath() 是 iOS 5 中的新 API（酷！）
也是一个等效的 pre-iOS5 - CGContextReplacePathWithStrokedPath - 它已经存在了很长时间。