Textured Line in CG

Question

I am working on a Drawing App for iOS. In this app i need to draw textured lines. For this i am using this method.But texture is so small and not in shape.

I want to know what i did wrong and how can i resolve it.

Here is my updated code-

        CGPoint mid1 = midPoint(previousPoint1, previousPoint2);
        CGPoint mid2 = midPoint(currentPoint, previousPoint1);


        [curImage drawAtPoint:CGPointMake(0, 0)];
        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);


        CGContextSetLineJoin(context, kCGLineJoinRound);
        CGContextSetLineWidth(context, self.lineWidth);
        //trans layer
        CGContextBeginTransparencyLayer(context, nil);//
        CGRect rect=CGContextGetPathBoundingBox (context);//
        CGContextSetStrokeColorWithColor(context, [UIColor redColor].CGColor);//
        //trans layer end

        CGContextSetShouldAntialias(context, YES);  
        CGContextSetAllowsAntialiasing(context, YES);
        CGContextSetFlatness(context, 0.1f);
        CGContextSetAlpha(context, self.lineAlpha);
        CGContextStrokePath(context);


       //patter start
        CGContextSetFillColorSpace(context, CGColorSpaceCreatePattern(NULL));
        static const CGPatternCallbacks callbacks = { 0, &lightDataArea, NULL };

        CGPatternRef hello = CGPatternCreate(NULL, rect, CGAffineTransformIdentity, 0, 0, kCGPatternTilingConstantSpacing, YES, &callbacks);
        CGFloat alpha = 1;


        CGContextSetFillPattern(context, hello, &alpha);
        CGContextFillRect(context, rect);
        //pattern end


        //trans layer remaining
        CGContextSetBlendMode(context, kCGBlendModeSourceIn);//
        CGContextDrawImage(context, rect, [self image:[UIImage imageNamed:@"dddd.jpg"] withColor:[UIColor blueColor]].CGImage);//
        CGContextEndTransparencyLayer (context);//
        //trans layer end

CGPatterCallback -

void lightDataArea (void *info, CGContextRef context)
{
      UIImage *image = [UIImage imageNamed:@"dddd.png"];
      CGImageRef imageRef = [image CGImage];
      CGContextDrawImage(context, CGRectMake(0, 0, 100, 100), imageRef);
}

This is what i am getting

my texture image

Still the same result. Help me please. I have very little knowledge about CG.

Chatelain

In the code you showed, you forgot to stroke the path before blending the image with the stroke. – Bobstay

Answer 1

But texture is so small and not in shape.

That's because you're drawing the image exactly once into the path's bounding rectangle.

What you're doing is like printing the image onto a single, small square of really stretchy fabric, and then stretching it out to the size of the path.

Using a rectangle whose size is that of the image would put it back “in shape”, but it'd still be small, because the image is small. Moreover, if you only drew it once at that size, it wouldn't cover the entire area of most paths.

You need to fill the rectangle with a pattern based on that image. Create a CGPattern that draws the image, then set the fill pattern to that pattern and fill the path's bounding rectangle.

Bobstay

@HarvantS.: You're still doing the wrong thing (drawing the image into the path's bounding rectangle), clobbering the right thing that you did immediately before that. Remove that code and just use the CGPattern. – Bobstay