在Core Graphics中平滑圆角笔划 [英] Smoothing a rounded stroke in Core Graphics
问题描述
我正在使用渐变背景创建自己的UITableViewCells。我已经完成了所有的逻辑和绘图，但我想解决的一件事是我的自定义单元格角落周围的厚片：
I am creating my own UITableViewCells with a gradient background. I have all the logic and drawing worked out, but one thing I want to fix is the "chunkiness" around the corners of my custom cell:
如果你放大在角落里，你可以看到我在说什么。以下是我用来生成单元格的代码：
If you zoom in on the corners, you can see what I am talking about. Here is the code I a using to generate the cell:
CGContextRef c = UIGraphicsGetCurrentContext();
CGColorSpaceRef myColorspace = CGColorSpaceCreateDeviceRGB();
CGGradientRef myGradient = nil;
CGFloat components[8] = TABLE_CELL_BACKGROUND;
CGContextSetStrokeColorWithColor(c, [[UAColor colorWithWhite:0.7 alpha:1] CGColor]);
CGContextSetLineWidth(c, 2);
CGContextSetAllowsAntialiasing(c, YES);
CGContextSetShouldAntialias(c, YES);
CGFloat minx = CGRectGetMinX(rect) , midx = CGRectGetMidX(rect), maxx = CGRectGetMaxX(rect) ;
CGFloat miny = CGRectGetMinY(rect) , maxy = CGRectGetMaxY(rect) ;
CGMutablePathRef path = CGPathCreateMutable();
CGPathMoveToPoint(path, NULL, minx, miny);
CGPathAddArcToPoint(path, NULL, minx, maxy, midx, maxy, kDefaultMargin);
CGPathAddArcToPoint(path, NULL, maxx, maxy, maxx, miny, kDefaultMargin);
CGPathAddLineToPoint(path, NULL, maxx, miny);
CGPathAddLineToPoint(path, NULL, minx, miny);
CGPathCloseSubpath(path);
// Fill and stroke the path
CGContextSaveGState(c);
CGContextAddPath(c, path);
CGContextClip(c);
CGFloat locations[2] = { 0.0, 1.0 };
CGFloat mycomponents[8] = TABLE_CELL_BACKGROUND;
CGColorSpaceRef myColorspace = CGColorSpaceCreateDeviceRGB();
myGradient = CGGradientCreateWithColorComponents(myColorspace, mycomponents, locations, 2);
CGContextDrawLinearGradient(c, myGradient, CGPointMake(minx,miny), CGPointMake(minx,maxy), 0);
CGContextRestoreGState(c);
CGContextAddPath(c, path);
CGContextStrokePath(c);
在保持所有单元格的边缘厚度一致的同时，我可以做些什么来平滑边缘？
What can I do to smooth the edges while keeping a consistent edge thickness across all cells?
推荐答案
您的线宽设置为2磅。发生的事情是你的代码在计算你的边界矩形而不了解线的宽度。结果是，对于形状的每个直线段，只有一半的笔划宽度可见。在弧上，可以看到全行程宽度。
Your line width is set to 2 points. What's happening is that your code is calculating your bounding rect without understanding the width of the line. The result is that for every straight segment of your shape, only half of the stroke's width is visible. On the arc, the full stroke width is visible.
以下是我的应用程序Funversation的相关代码段，用于绘制类似于您所拥有的圆角的扑克牌。
Here's the relevant segment of code from my app, Funversation, to draw the playing cards with rounded corners similar to what you have.
CGRect rect = [self bounds];
rect.size.width -= lineWidth;
rect.size.height -= lineWidth;
rect.origin.x += lineWidth / 2.0;
rect.origin.y += lineWidth / 2.0;
在计算minx，midx，maxx等之前添加它，你的形状的笔画应该是统一的。
Add that before your calculation for minx, midx, maxx, etc. and the strokes for your shape should be uniform.
这篇关于在Core Graphics中平滑圆角笔划的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
