7
votes

To sort out my last problem : Draw/Paint like sketch color inside a bezier path in UIView, I took an exact Image (of path) filled with selected color. Then, to draw that in UIView, for context color I took:

lineColor=[UIColor colorWithPatternImage:img];

in drawrect :

CGPoint mid1 = midPoint(previousPoint1, previousPoint2);
CGPoint mid2 = midPoint(currentPoint, previousPoint1);
[curImage drawInRect:CGRectZero];
CGContextRef context = UIGraphicsGetCurrentContext();
[self.layer renderInContext:context];
CGContextMoveToPoint(context, mid1.x, mid1.y);
CGContextAddQuadCurveToPoint(context, 
                             previousPoint1.x, 
                             previousPoint1.y, 
                             mid2.x, 
                             mid2.y);
CGContextSetLineCap(context, kCGLineCapRound);
CGContextSetBlendMode(context, kCGBlendModeCopy);
CGContextSetLineJoin(context, kCGLineJoinRound);
CGContextSetLineWidth(context, self.lineWidth);
CGContextSetStrokeColorWithColor(context,lineColor.CGColor);
CGContextSetShouldAntialias(context, YES);
CGContextSetAllowsAntialiasing(context, YES);
CGContextSetFlatness(context,0.5);
CGContextSetAlpha(context, 1.0);
CGContextStrokePath(context);

It draws exactly in the path of view but on boundaries the color goes out like melting effect.

Source Image in which color has to be filled : Image to be filled with color

image to be used as colorWithPatternImage (img)enter image description here

After drawing on touches ,resultimg Image : enter image description here

What am I missing here to fill it perfectly? Any help with core graphics is most welcomed! Thank You!

To mask the image I also did :

-(void)clipView :(MyUIBezierPath*)path drawingView:(DrawingView*)myView
{
    MyUIBezierPath *myClippingPath =path;
    CAShapeLayer *mask = [CAShapeLayer layer];
    mask.path = myClippingPath.CGPath;
    myView.layer.mask = mask;
}

But colorWithPatternImage and this masking does the same trick i.e lets me draw only inside the path , the problem I am facing now is : It gives a bad effect on drawing on touch points around the boundaries of path !

2
Should you not be applying a clipping mask to the layer, so you only see it draw inside the bezier. See stackoverflow.com/questions/20410146/…Rory McKinnel
I tried it all ready.Its the same issue with this , the color around boundary still feels like flowing , not outside though , from inside it flows away from boundary of path.Problem is with draw at touch points , masking isn't the issue.user3978087
Is it the same with anti-alias off?Rory McKinnel
Yes I tried : CGContextSetShouldAntialias(context, NO); CGContextSetAllowsAntialiasing(context, NO); but this also doesnt help !!user3978087

2 Answers

1
votes

Well its working with my own masking method via colorWithPatternImage , though masking it by clipping is the same thing.Drawing issue was because of the image being drawn at touch point in the method "calculateMinImageArea: CGPoint1 :CGPoint2 :CGPoint3". Changing its dimensions (height-width according to line width) sorts it out.

0
votes

You can create a path points out of this image. Then make a CGPathRef or CGMutablePathRef and then use it as a mask to your CGContextRef.