Calculate distance of shape and display it in UILabel - ios

Question

I'm drawing lines in an app by connecting two points, what I want to do next is to display a label at the middle of the line displaying its length. This is what I'm using for the length calculation:
CGFloat dx = point2.x - point1.x;
CGFloat dy = point2.y - point1.y;
return sqrt(dx*dx + dy*dy );
How could I display the distance in in or cm and how would I place the label in the middle of the line.
Thanks
EDIT: Here's my drawRect method, with what I've tried:
- (void)drawRect:(CGRect)rect
{
// Drawing code
if ([_pointsArray count] > 0) {
int i;
CGContextRef c = UIGraphicsGetCurrentContext();
CGContextSetLineWidth(c, 7.0f);
CGContextSetLineCap(c, kCGLineCapRound);
CGContextSetStrokeColorWithColor(c, [UIColor blueColor].CGColor);
for (i = 0; i < ([_pointsArray count]-1); i++) {
CGPoint p1 = [[self.pointsArray objectAtIndex:i]CGPointValue];
CGPoint p2 = [[self.pointsArray objectAtIndex:i+1]CGPointValue];
CGContextMoveToPoint(c, p1.x, p1.y);
CGContextAddLineToPoint(c, p2.x, p2.y);
UILabel *lengthLabel = [[UILabel alloc]init];
CGFloat dx = p2.x - p1.x;
CGFloat dy = p2.y - p1.y;
CGFloat result = sqrt(dx*dx + dy*dy);
lengthLabel.text = [NSString stringWithFormat:#"%f", result];
CGContextStrokePath(c);
}
}
}

Answer 1

The first thing you need to do is find where to put the text. Start by finding the center of the line. This is simple geometry based on the two points you have:
CGPoint p1 = [[self.pointsArray objectAtIndex:i]CGPointValue];
CGPoint p2 = [[self.pointsArray objectAtIndex:i+1]CGPointValue];
CGPoint lineCenter = CGPointMake((p1.x + p2.x) / 2.0, (p1.y + p2.y) / 2.0);
Now you need to calculate the rectangle to draw the text.
NSString *text = [NSString stringWithFormat:#"%f", result];
UIFont *font = [UIFont systemFontWithSize:14]; // pick a size
NSDictionary *attrs = #{ NSFontAttributeName : font, NSForegroundColorAttributeName : [UIColor blueColor] }; // pick a color
CGSize *textSize = [text sizeWithAttributes:attrs];
Now you have the line center and the text size you need to calculate the text rectangle:
CGRect textRect = CGRectMake(lineCenter.x - (textSize.width / 2.0), lineCenter.y - (textSize.height / 2.0), textSize.width, textSize.height);
And now you can draw the text:
[text drawInRect:textRect withAttributes:attrs];
All together with your code:
UIFont *font = [UIFont systemFontWithSize:14]; // pick a size
NSDictionary *attrs = #{ NSFontAttributeName : font, NSForegroundColorAttributeName : [UIColor blueColor] }; // pick a color
for (i = 0; i < ([_pointsArray count]-1); i++) {
CGPoint p1 = [[self.pointsArray objectAtIndex:i]CGPointValue];
CGPoint p2 = [[self.pointsArray objectAtIndex:i+1]CGPointValue];
CGContextMoveToPoint(c, p1.x, p1.y);
CGContextAddLineToPoint(c, p2.x, p2.y);
CGFloat dx = p2.x - p1.x;
CGFloat dy = p2.y - p1.y;
CGFloat result = sqrt(dx*dx + dy*dy);
NSString *text = [NSString stringWithFormat:#"%f pts", result];
CGPoint lineCenter = CGPointMake((p1.x + p2.x) / 2.0, (p1.y + p2.y) / 2.0);
CGSize *textSize = [text sizeWithAttributes:attrs];
CGRect textRect = CGRectMake(lineCenter.x - (textSize.width / 2.0), lineCenter.y - (textSize.height / 2.0), textSize.width, textSize.height);
[text drawInRect:textRect withAttributes:attrs];
CGContextStrokePath(c);
}
Notes:
This is untested. There could be typos.
This draws the line length in points. You need to find your own way to convert to other units.