要画出上图这样的一个三彩圆弧，首先创建一个 UIView，重写drawRect方法：
-(void) drawRect: (CGRect) rect
{
CGContextRef context = UIGraphicsGetCurrentContext();
CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
// 画渐变背景色圆形
// 裁掉中间圆
// 截取弧线
CGColorSpaceRelease(colorSpace);
}
第一步我们要画一个正方形的带渐变背景色的方块，代码如下：
UIColor *baseColor = [UIColor colorWithRed:246.0/255.0 green:71.0/255.0 blue:71.0/255.0 alpha:1.0];
UIColor *middleColor = [UIColor colorWithRed:253.0/255.0 green:188.0/255.0 blue:51.0/255.0 alpha:1.0];
UIColor *endColor = [UIColor colorWithRed:32.0/255.0 green:197.0/255.0 blue:102.0/255.0 alpha:1.0];
CGContextSaveGState(context);
NSArray * gradientColors = @[(__bridge id)baseColor.CGColor, (__bridge id)middleColor.CGColor, (__bridge id)endColor.CGColor];
CGFloat locations[] = { 0.0, 0.4, 0.8 };
CGGradientRef gradient = CGGradientCreateWithColors(colorSpace, (__bridge CFArrayRef) gradientColors, locations);
CGPoint startPoint = CGPointMake(0, rect.size.height/2);
CGPoint endPoint = CGPointMake(rect.size.width, rect.size.height/2);
CGContextDrawLinearGradient(context, gradient, startPoint, endPoint, 0);
再在这个方块的基础上截取一个圆形，在上面的代码之上添加以下代码：
CGContextAddEllipseInRect(context, rect);
CGContextClip(context);
在这个圆形中间上画一个较小的圆形，填充色和背景色一致，半径等于大圆半径减圆弧半径，如下：
CGRect innerCircleRect = CGRectMake(arcBorderWidth, arcBorderWidth, width-arcBorderWidth*2, width-arcBorderWidth*2);
CGContextAddEllipseInRect(context, innerCircleRect);
CGContextSetFillColorWithColor(context, fillColor.CGColor);
CGContextFillPath(context);
最后，按角度截取需要的圆弧
CGFloat startAngle = 0.9*M_PI;
CGFloat endAngle = 0.1*M_PI;
CGMutablePathRef arcPath = CGPathCreateMutable();
CGPathAddArc(arcPath, NULL, center.x, center.y, width/2-1, startAngle, endAngle, YES);
CGContextSetLineWidth(context, arcBorderWidth*2);
CGContextAddPath(context, arcPath);
CGContextSetStrokeColorWithColor(context, fillColor.CGColor);
CGContextStrokePath(context);
最终效果图
