Using CGContext to draw line

Question

I wanted to draw a line using CGContext and what I have so far is:

CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSetStrokeColorWithColor(context, [UIColor blackColor].CGColor);
CGContextSetLineWidth(context, 1.0f);
CGContextMoveToPoint(context, 10, 10); 
CGContextAddLineToPoint(context, 100, 50);
CGContextStrokePath(context);

It always draws from the top left corner to the top bottom right corner. How can I adjust the start and end origin of this line? How do I adjust the length of the line?

Answer 1

CoreGraphics == Good Times.

It's been a while since I did anything freehand as it were, what I do these days is to build everything ahead of drawing operations. Remember that there is an implicit 'cursor', from the days of Logo , and you can move it without making the move a drawing operation, but you have to specify it. I think a good approach (at least for static figures) is to create those paths you will have to draw first, then using the path over and over for things like fill, stroke, shading.

   CGColorRef fillColor = // yadda
   CGColorRef strokeColor = // yadda

   const CGFloat radius = 5.0;

   // Create the path first - rounded rectangle
   CGMutablePathRef path = CGPathCreateMutable();
   CGPathMoveToPoint(path, NULL, 100.0 - radius, 10.0);
   CGPathAddLineToPoint(path, NULL, 10.0 + radius, 10.0);
   CGPathAddArcToPoint(path, NULL, 10.0, 10.0, 10.0, 10.0 + radius, radius);
   CGPathAddLineToPoint(path, NULL, 10.0, 100.0 - radius);
   CGPathAddArcToPoint(path, NULL, 10.0, 100.0, 10.0 + radius, 100.0, radius);
   CGPathAddLineToPoint(path, NULL, 100.0 - radius, 100.0);
   CGPathAddArcToPoint(path, NULL, 100.0, 100.0, 100.0, 100.0 - radius, radius);
   CGPathAddLineToPoint(path, NULL, 100.0, 10.0 + radius);
   CGPathAddArcToPoint(path, NULL, 100.0, 10.0, 100.0 - radius, 10.0, radius);
   CGPathCloseSubpath(path);

   // Then use it in your draw commands
   CGContextSetStrokeColor(context, CGColorGetComponents(strokeColor));
   CGContextSetFillColor(context, CGColorGetComponents(fillColor));
   CGContextSetLineJoin(context, kCGLineJoinMiter);
   CGContextSetLineWidth(context, strokeWidth);

   CGContextAddPath(context, path);
   CGContextDrawPath(context, kCGPathFillStroke);
   CGPathRelease(path); 

Etc. You can release the path at the end if you want, or keep the reference around for use later on.

Answer 2

These two lines are responsible for the start and end points:

CGContextMoveToPoint(context, 10, 10);    // This sets up the start point
CGContextAddLineToPoint(context, 100, 50); // This moves to the end point.

By adjusting these two x, y points you can adjust the line. The length of the line depends on the start and end points.

Following on from psoft's answer - here's a basic example project of drawing, including creating a path and stroking it.

This is explained in more detail with more sample code in the Quartz 2D guide for paths .