iOS绘图系列三：画弧线CGContextAddArc ，CGContextAddArcToPoint，CGContextAddCurveToPoint，UIBezierPath

这一节我们来画弧线，我们需要达到的目标是如图所示

可以用CGContext 去实现

    CGContextRef ctx = UIGraphicsGetCurrentContext();
    CGContextSetRGBStrokeColor(ctx, 1, 0, 0, 1);//设置线的颜色
    CGContextSetRGBFillColor(ctx, 0, 0, 1, 1);//设置填充颜色
    CGContextSetLineWidth(ctx, 2); //设置线的宽度
    
    CGContextAddEllipseInRect(ctx, CGRectMake(10, 30, 60, 60)); //画一个椭圆或者圆
    CGContextDrawPath(ctx, kCGPathFillStroke);
    //根据中心点，半径，起始的弧度，最后的弧度，是否顺时针画一个圆弧
    CGContextAddArc(ctx, 140, 60, 30, M_PI/2.f, M_PI, 1);
    CGContextDrawPath(ctx, kCGPathStroke);
    
    CGPoint p[3] =
	{
		CGPointMake(210.0, 30.0),
		CGPointMake(210.0, 60.0),
		CGPointMake(240.0, 60.0),
	};
    //先移到p1点
	CGContextMoveToPoint(ctx, p[0].x, p[0].y);
    //从p1点开始画弧线，圆弧和p1-p2相切;p2-p3和弧线相切,圆弧的半径是20
	CGContextAddArcToPoint(ctx, p[1].x, p[1].y, p[2].x, p[2].y, 20.0);
	CGContextStrokePath(ctx);
    
    //画一个圆角矩形
    CGRect rrect = CGRectMake(210.0, 70.0, 60.0, 60.0);
	CGFloat radius = 10.0;
	CGFloat minx = CGRectGetMinX(rrect), midx = CGRectGetMidX(rrect), maxx = CGRectGetMaxX(rrect);
	CGFloat miny = CGRectGetMinY(rrect), midy = CGRectGetMidY(rrect), maxy = CGRectGetMaxY(rrect);
    CGContextMoveToPoint(ctx, minx, midy);
	CGContextAddArcToPoint(ctx, minx, miny, midx, miny, radius);
	CGContextAddArcToPoint(ctx, maxx, miny, maxx, midy, radius);
	CGContextAddArcToPoint(ctx, maxx, maxy, midx, maxy, radius);
	CGContextAddArcToPoint(ctx, minx, maxy, minx, midy, radius);
	CGContextClosePath(ctx);
	CGContextDrawPath(ctx, kCGPathFillStroke);
    
    //贝塞尔曲线一,两个控制点
    CGPoint s = CGPointMake(30.0, 120.0); //起始点
	CGPoint e = CGPointMake(300.0, 120.0);//终点
	CGPoint cp1 = CGPointMake(120.0, 30.0);//控制点1
	CGPoint cp2 = CGPointMake(210.0, 210.0);//控制点2
	CGContextMoveToPoint(ctx, s.x, s.y);
	CGContextAddCurveToPoint(ctx, cp1.x, cp1.y, cp2.x, cp2.y, e.x, e.y);
	CGContextStrokePath(ctx);
    
    //贝塞尔曲线二,一个控制点
	s = CGPointMake(30.0, 300.0);
	e = CGPointMake(270.0, 300.0);
	cp1 = CGPointMake(150.0, 180.0);
	CGContextMoveToPoint(ctx, s.x, s.y);
	CGContextAddQuadCurveToPoint(ctx, cp1.x, cp1.y, e.x, e.y);
	CGContextStrokePath(ctx);

用UIKit去实现

    UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(10, 30, 60, 60)];
    [[UIColor redColor] setStroke];
    [[UIColor blueColor] setFill];
    path.lineWidth = 2;
    [path stroke];
    [path fill];
    
    path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(140, 60) radius:30 startAngle:M_PI/2.f endAngle:M_PI clockwise:YES];
    path.lineWidth = 2;
    [path stroke];
    
    path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(210, 70, 60, 60) cornerRadius:5];
    path.lineWidth = 2;
    [path stroke];
    [path fill];
    
    path = [UIBezierPath bezierPath];
    path.lineWidth = 2;
    CGPoint s = CGPointMake(30.0, 120.0);
    CGPoint e = CGPointMake(300.0, 120.0);
    CGPoint cp1 = CGPointMake(120.0, 30.0);
    CGPoint cp2 = CGPointMake(210.0, 210.0);
    [path moveToPoint:s];
    [path addCurveToPoint:e controlPoint1:cp1 controlPoint2:cp2];
    [path stroke];
    
    path = [UIBezierPath bezierPath];
    path.lineWidth = 2;
    s = CGPointMake(30.0, 300.0);
    e = CGPointMake(270.0, 300.0);
    cp1 = CGPointMake(150.0, 180.0);
    [path moveToPoint:s];
    [path addQuadCurveToPoint:e controlPoint:cp1];
    [path stroke];