Add image, which drawing with UIBezier or CGContextRef into UIView sublayer

Question

In this code I use CGContextRef to create next picture on my UIView:

CGMutablePathRef arc = CGPathCreateMutable();
CGFloat lineWidth = 16.0;
CGContextRef cont = UIGraphicsGetCurrentContext();
CGContextFlush(cont);
CGContextSetStrokeColorWithColor(cont, [UIColor grayColor].CGColor);
CGContextSetFillColorWithColor(cont, [UIColor clearColor].CGColor);

for (int i = 0; i < 16; i++) {
    CGPathAddArc(arc, NULL, cenPoint.x, cenPoint.y, halfWidthInc(-8.0f), DEG_TO_RAD(_deg1*i), DEG_TO_RAD(_deg1*(i+1)), NO);
    CGPathRef strokedArc = CGPathCreateCopyByStrokingPath(arc, NULL, lineWidth, kCGLineCapButt, kCGLineJoinMiter, 10);
    CGContextAddPath(cont, strokedArc);
}

for (int i = 0; i < 8; i++) {
    arc = CGPathCreateMutable();
    CGPathAddArc(arc, NULL, cenPoint.x, cenPoint.y, halfWidthInc(-24.0f), DEG_TO_RAD(_deg2*i), DEG_TO_RAD(_deg2*(i+1)), NO);
    CGPathRef strokedArc = CGPathCreateCopyByStrokingPath(arc, NULL, lineWidth, kCGLineCapButt, kCGLineJoinMiter, 10);
    CGContextAddPath(cont, strokedArc);
}

for (int i = 0; i < 4; i++) {
    arc = CGPathCreateMutable();
    CGPathAddArc(arc, NULL, cenPoint.x, cenPoint.y, halfWidthInc(-40.0f), DEG_TO_RAD(_deg3*i), DEG_TO_RAD(_deg3*(i+1)), NO);
    CGPathRef strokedArc = CGPathCreateCopyByStrokingPath(arc, NULL, lineWidth, kCGLineCapButt, kCGLineJoinMiter, 10);
    CGContextAddPath(cont, strokedArc);
}

for (int i = 0; i < 2; i++) {
    arc = CGPathCreateMutable();
    CGPathAddArc(arc, NULL, cenPoint.x, cenPoint.y, halfWidthInc(-56.0f), DEG_TO_RAD(_deg4*i), DEG_TO_RAD(_deg4*(i+1)), NO);
    CGPathRef strokedArc = CGPathCreateCopyByStrokingPath(arc, NULL, lineWidth, kCGLineCapButt, kCGLineJoinMiter, 10);
    CGContextAddPath(cont, strokedArc);
}


CGContextDrawPath(cont, kCGPathFillStroke);

But I want to transform in with CATransform3D. For it I must draw this context in sublayer of my UIView (because I want to draw more sublayers on it UIView). How can I draw this CGContextRef path in separate sublayer of UIView?

Ivan Trubnikov · Answer 1 · 2016-04-22T09:34:37.070

I fix it with next construction:

CGPathRef *board = CGContextCopyPath(cont);

_indi1 = [CAShapeLayer layer];
_indi1.frame = self.layer.bounds;
_indi1.bounds = CGRectInset(pathCont, 0, 0);
_indi1.geometryFlipped = YES;
_indi1.path = board;
_indi1.strokeColor = [[UIColor colorWithRed:125.0f/255.0f green:251.0f/255.0f blue:181.0f/255.0f alpha:1] CGColor];
_indi1.fillColor = nil;
_indi1.lineWidth = 1.0f;
_indi1.fillRule = kCAFillRuleEvenOdd;
_indi1.lineJoin = kCALineJoinRound;

[self.layer insertSublayer:_indi1 atIndex:0];

_indi1 - property of superclass with CAShapeLayer type. It's works, but result looks without smoothing (with raw pixilation). Like this:

How can i fix it and make picture more smooth?

P.S.: this problem popup when i try to convert CGContext to CAShapeLayer. In first example, when I make it with CGContext this problem has not been. (You can look it in first example on top post)

Add image, which drawing with UIBezier or CGContextRef into UIView sublayer

1 Answers1