title: Objective-C Draw a Circle with a Ring shape
body: <p>I wrote this class that draws a animated progress with a circle (it draws a circular sector based on a float progress)</p>
  
  <pre><code>@implementation MXMProgressView
  
  @synthesize progress;
  
  - (id)initWithDefaultSize {
      int circleOffset = 45.0f;
      self = [super initWithFrame:CGRectMake(0.0f,
                                             0.0f,
                                             135.0f + circleOffset,
                                             135.0f + circleOffset)];
      self.backgroundColor = [UIColor clearColor];
      return self;
  }
  
  - (void)drawRect:(CGRect)rect {
  
      CGRect allRect = self.bounds;
      CGRect circleRect = CGRectMake(allRect.origin.x + 2, allRect.origin.y + 2, allRect.size.width - 4,
                                     allRect.size.height - 4);
  
      CGContextRef context = UIGraphicsGetCurrentContext();
  
      // background image
      //UIImage *image = [UIImage imageNamed:@"loader_disc_hover.png"]; 
      //[image drawInRect:circleRect];
  
      // Orange: E27006
      CGContextSetRGBFillColor(context, 
                               ((CGFloat)0xE2/(CGFloat)0xFF),
                               ((CGFloat)0x70/(CGFloat)0xFF),
                               ((CGFloat)0x06/(CGFloat)0xFF),
                               0.01f); // fill
  
      //CGContextSetLineWidth(context, 2.0);
      CGContextFillEllipseInRect(context, circleRect);
      //CGContextStrokeEllipseInRect(context, circleRect);
  
      // Draw progress
      float x = (allRect.size.width / 2);
      float y = (allRect.size.height / 2);
  
      // Orange: E27006
      CGContextSetRGBFillColor(context, 
                               ((CGFloat)0xE2/(CGFloat)0xFF),
                               ((CGFloat)0x70/(CGFloat)0xFF),
                               ((CGFloat)0x06/(CGFloat)0xFF),
                               1.0f); // progress
  
      CGContextMoveToPoint(context, x, y);
      CGContextAddArc(context, x, y, (allRect.size.width - 4) / 2, -M_PI_2, (self.progress * 2 * M_PI) - M_PI_2, 0);
      CGContextClosePath(context);
      CGContextFillPath(context);
  }
  
  @end
  </code></pre>
  
  <p>Now what I want to do I to draw a ring shape with the same progress animation, instead of filling the full circle, so a circular sector again not starting from the center of the circle.</p>
  
  <p>I tried with <code>CGContextAddEllipseInRect</code> and the <code>CGContextEOFillPath(context);</code></p>
  
  <p>with no success.</p>