iOS - Draw Arcs Using CGContextAddCurveToPoint

Stephen Zaharuk / Monday, January 04, 2016

This is a bit more of an special use case topic, but something I wanted to accomplish a while ago, and I thought I'd share it for anyone else trying to solve a similar problem. 

I wanted to have a more generic way of Drawing Arcs, instead of using CGContextAddArc. 

However, figuring out the math to do this in using Curves instead was pretty tricky. Luckily i stumbled across a blog which did something similar. You can read it here. 

So here is my implementation in case anyone else out there is looking to the same. This implementation is in Objective-C:

struct CubicBezierControlPoints
{
    CGPoint p1;
    CGPoint p2;
};

typedef struct CubicBezierControlPoints CubicBezierControlPoints;

CubicBezierControlPoints CubicBezierControlPointsMake(CGFloat startRadians, CGFloat endRadians, CGFloat radius, CGPoint center )
{
   CGFloat theta = endRadians - startRadians;
   CGFloat startAngle = startRadians;

   CGFloat x0 = cos(theta/2.0);
   CGFloat y0 = sin(theta/2.0);
   CGFloat x1 = (4.0-x0)/3.0;
   CGFloat y1 = ((1.0-x0)*(3.0-x0))/(3.0*y0);
   CGFloat x2 = x1;
   CGFloat y2 = 0-y1;

   CGFloat bezAng = startAngle + theta/2.0;
   CGFloat cBezAng = cos(bezAng);
   CGFloat sBezAng = sin(bezAng);
   CGFloat rx1 = cBezAng * x1 - sBezAng * y1;
   CGFloat ry1 = sBezAng * x1 + cBezAng * y1;
   CGFloat rx2 = cBezAng * x2 - sBezAng * y2;
   CGFloat ry2 = sBezAng * x2 + cBezAng * y2;

   CubicBezierControlPoints cbp;
   cbp.p1 = CGPointMake(center.x + radius*rx1, center.y + radius*ry1);
   cbp.p2 = CGPointMake(center.x + radius*rx2, center.y + radius*ry2);
   return cbp;
}

Hope this helps someone else like it helped me.

By Stephen Zaharuk (SteveZ)