绘图核心显卡

问题描述:

我想复制默认的iPad的日历事件标记,它看起来像这样圆角的矩形:绘图核心显卡

enter image description here 我试图用这个CoreGraphics中,画一个圆角的矩形的路径。这是结果我能想出:

enter image description here

正如你所看到的,iPad的版本看起来圆角更平滑。我试图用一个更大的线宽,它看起来像这样: enter image description here

我的代码看起来像这样(从本网站得到它):

UIColor* fillColor= [self.color colorByMultiplyingByRed:1 green:1 blue:1 alpha:0.2]; 

CGContextSetLineWidth(ctx, 1.0); 
CGContextSetStrokeColorWithColor(ctx, self.color.CGColor); 
CGContextSetFillColorWithColor(ctx, fillColor.CGColor); 

CGRect rrect = self.bounds; 

CGFloat radius = 30.0; 
CGFloat width = CGRectGetWidth(rrect); 
CGFloat height = CGRectGetHeight(rrect); 

if (radius > width/2.0) 
    radius = width/2.0; 

if (radius > height/2.0) 
    radius = height/2.0;  

CGFloat minx = CGRectGetMinX(rrect); 
CGFloat midx = CGRectGetMidX(rrect); 
CGFloat maxx = CGRectGetMaxX(rrect); 
CGFloat miny = CGRectGetMinY(rrect); 
CGFloat midy = CGRectGetMidY(rrect); 
CGFloat maxy = CGRectGetMaxY(rrect); 
CGContextMoveToPoint(ctx, minx, midy); 
CGContextAddArcToPoint(ctx, minx, miny, midx, miny, radius); 
CGContextAddArcToPoint(ctx, maxx, miny, maxx, midy, radius); 

CGContextAddArcToPoint(ctx, maxx, maxy, midx, maxy, radius); 
CGContextAddArcToPoint(ctx, minx, maxy, minx, midy, radius); 
CGContextClosePath(ctx); 
CGContextDrawPath(ctx, kCGPathFillStroke); 

// draw circle on left side 

CGRect target= CGRectMake(rect.origin.x + 4.0, 
          rect.origin.y + 3.0, 
          7.0, 7.0); 

CGContextSetFillColorWithColor(ctx, self.color.CGColor); 
CGContextSetAlpha(ctx, 0.4); 
CGContextFillEllipseInRect(ctx, target); 

CGContextSetAlpha(ctx, 0.9); 
CGContextSetStrokeColorWithColor(ctx, self.color.CGColor); 
CGContextStrokeEllipseInRect(ctx, target); 

谁能帮助我带来的结果更接近原本的?我是否应该使用不同的技术来绘制圆角矩形,或者是否有任何参数可以更改以使其看起来更平滑? 我已经尝试过使用UIBezierPath,但它基本上看起来一样。有小费吗?

[编辑] CGRectInset基于解决方案是这样的:

enter image description here

你的问题是,在应用笔触上的路径和它的一半的中心被裁剪/蒙面边界你的看法,因为它超出了你的看法。如果你在每个方向插入你的绘图点,你将得到你正在寻找的结果。如果增加笔画的宽度,则需要进一步插入绘图(按笔画宽度的一半(即4分宽度笔画应插入2分)。

这可以很容易地通过更改

CGRect rrect = self.bounds; 

// Inset x and y by half the stroke width (1 point for 2 point stroke) 
CGRect rrect = CGRectInset(self.bounds, 1, 1); 
+0

感谢您的代码,添加上面的结果。我认为这种解决方案会导致病态。仍然要玩的颜色,但我喜欢现在的样子:) – user826955

这是因为行程的路径,这意味着它的一半是你的矩形内,另一半超出中间位置。

要解决此问题,请在抚摸之前加倍笔划宽度和clip to the path。结果是一个内部笔画,它将完全位于矩形内。

请注意,剪切到Quartz中的当前路径将重置当前路径,因此您应该create the path as a CGPath,以便您可以add it,剪切到它,再次添加它并对其进行描边。