CoreGraphic之画图

参考文章 http://blog.csdn.net/rhljiayou/article/details/9919713

/贝塞尔基本用法
 -(void)bezier{
//初始化
UIBezierPath *path = [UIBezierPath bezierPath];
//设置起点
[path moveToPoint:CGPointMake(10, 10)];
//设置终点
[path addLineToPoint:CGPointMake(100, 100)];    
//设置线宽
[path setLineWidth:10.0];
//设置线冒
[path setLineCapStyle: kCGLineCapRound];
//设置拐角(两条直线才能有拐角)
[path setLineCapStyle:kCGLineCapRound];
//设置线的颜色
[[UIColor redColor] setStroke];
//设置填充颜色
[[UIColor yellowColor] setFill];
//闭合路径
[path closePath];
//填充
[path fill];
//绘制
[path stroke];
}

pragma mark--使用贝塞尔曲线画各种图形

 -(void)graphics{
 //不透明类型的quartz 2d绘画环境,相当于一个画布,可以在上面任意绘画
CGContextRef context = UIGraphicsGetCurrentContext();
//填充颜色
CGContextSetRGBFillColor(context, 1, 0, 0, 1.0);
UIFont *font = [UIFont boldSystemFontOfSize:15.0];


[@"画扇形和椭圆：" drawInRect:CGRectMake(10, 160, 110, 20) withFont:font];

[@"画三角形：" drawInRect:CGRectMake(10, 220, 80, 20)  withFont:font];
[@"画圆角矩形：" drawInRect:CGRectMake(10, 260, 100, 20)  withFont:font];
[@"画贝塞尔曲线：" drawInRect:CGRectMake(10, 300, 100, 20)  withFont:font];
[@"图片：" drawInRect:CGRectMake(10, 340, 80, 20)  withFont:font];
[@"画圆：" drawInRect:CGRectMake(10, 20, 80, 20)  withFont:font];

pragma mark---画圆

//边框圆
CGContextSetRGBStrokeColor(context, 1, 1, 1, 1);//画笔的颜色
CGContextSetLineWidth(context, 1.0);//线的宽度


//void CGContextAddArc(CGContextRef c,CGFloat x, CGFloat y,CGFloat radius,CGFloat startAngle,CGFloat endAngle, int clockwise)1弧度＝180°/π （≈57.3°） 度＝弧度×180°/π 360°＝360×π/180 ＝2π 弧度
// x,y为圆点坐标，radius半径，startAngle为开始的弧度，endAngle为 结束的弧度，clockwise 0为顺
CGContextAddArc(context, 100, 20, 15, 0, 2 * M_PI, 0); //添加一个圆
CGContextDrawPath(context, kCGPathStroke);//绘制路径

//填充圆,无边框
CGContextAddArc(context, 150, 30, 30, 0, 2* M_PI, 0);
CGContextDrawPath(context, kCGPathFill);//绘制填充

//画大圆并填充颜色
UIColor *acolor = [UIColor colorWithRed:1 green:0 blue:0 alpha:1];
CGContextSetFillColorWithColor(context, acolor.CGColor);//填充颜色
CGContextSetLineWidth(context, 3.0);//线的宽度
CGContextAddArc(context, 250, 40, 40, 0, 2 * M_PI, 0);
//kCGPathFill填充非零绕数规则,只显示填充的颜色,不显示边框的颜色,kCGPathEOFill表示用奇偶规则(只显示填充颜色),kCGPathStroke路径(只显示画笔也就是边框的颜色),kCGPathFillStroke路径填充(边框颜色和填充颜色都显示),kCGPathEOFillStroke表示描线，不是填充(边框和画笔颜色都显示)
CGContextDrawPath(context,  kCGPathEOFillStroke);

 [@"画线及弧形" drawInRect:CGRectMake(10, 80, 100, 100) withFont:font];
CGPoint apoint[2];//坐标点
apoint[0] = CGPointMake(100, 80);//坐标1
apoint[1] = CGPointMake(130, 80);//坐标2

// CGContextAddLines(CGContextRef _Nullable c, const CGPoint * _Nullable points, size_t count)

//第二个参数 points[],坐标数组,第三个参数 count大小
CGContextAddLines(context, apoint, 2);//添加线
CGContextDrawPath(context, kCGPathStroke);//根据坐标绘制路径

pragma mark ---画笑脸弧形

//左
CGContextSetRGBStrokeColor(context, 0, 0, 1, 1);//改变画笔颜色
CGContextMoveToPoint(context, 140, 80);//开始坐标pi
//CGContextAddArcToPoint(CGContextRef  _Nullable c, CGFloat x1, CGFloat y1, CGFloat x2, CGFloat y2, CGFloat radius)
//x1 ,y1跟p1形成一条线的坐标p2,x2,y2结束坐标跟p3(x1,y1)形成一条直线,radius:半径 注意算好半径的大小
CGContextAddArcToPoint(context, 148, 68, 156, 80, 10);
CGContextStrokePath(context);//绘制路径

//右
CGContextMoveToPoint(context, 160, 80);//开始坐标p1

CGContextAddArcToPoint(context, 168, 68, 176, 80, 10);
CGContextStrokePath(context);

//下
CGContextMoveToPoint(context, 150, 90);
CGContextAddArcToPoint(context, 158, 102, 166, 90, 10);
CGContextStrokePath(context);

pragma mark ----画矩形

CGContextStrokeRect(context, CGRectMake(100, 120, 10, 10));//画方框
CGContextFillRect(context, CGRectMake(120, 120, 10, 10));//填充框
//矩形,并填充颜色
CGContextSetLineWidth(context, 2.0);//线的宽度
acolor = [UIColor blueColor];
CGContextSetFillColorWithColor(context, acolor.CGColor);//填充颜色
acolor = [UIColor yellowColor];
CGContextSetStrokeColorWithColor(context, acolor.CGColor);
CGContextAddRect(context, CGRectMake(140, 120, 60, 30));
CGContextDrawPath(context, kCGPathFillStroke);

pragma mark---矩形并渐变改变颜色

//第一种填充方式,第一种方式必须导入类库quartcore并#import ,这个就不输入context上画了.而是将层插入到view层上面,那么这里就设计到quartz core图层编程了
CAGradientLayer *gradient1 = [CAGradientLayer layer];
gradient1.frame = CGRectMake(240, 120, 60, 30);
gradient1.colors = [NSArray arrayWithObjects:(id)[UIColor whiteColor].CGColor,(id)[UIColor grayColor].CGColor,(id)[UIColor blueColor].CGColor,(id)[UIColor yellowColor].CGColor,(id)[UIColor redColor].CGColor,(id)[UIColor greenColor].CGColor,(id)[UIColor orangeColor].CGColor,(id)[UIColor brownColor].CGColor, nil];

[self.layer insertSublayer:gradient1 atIndex:0];


//第二章填充方式
CGColorSpaceRef rgb = CGColorSpaceCreateDeviceRGB();
CGFloat clolors[] = {
    1,1,1,1.00,
    1,1,0,1.00,
    1,0,0,1.00,
    1,0,1,1.00,
    0,1,1,1.00,
    0,1,0,1.00,
    0,0,1,1.00,
    0,0,0,1.00

};
CGGradientRef gradient = CGGradientCreateWithColorComponents(rgb, clolors, NULL, sizeof(clolors)/(sizeof(clolors[0] * 4)));//形成梯形,渐变的效果
CGColorSpaceRelease(rgb);

//画线形成一个矩形
//CGContextSaveGState与CGContextRestoreCState的作用
//CGContextSaveGState函数的作用是将当前图形的状态推入堆栈.之后,您对图形的所做的修改会影响之后的描画操作,但不影响存储在堆栈中的拷贝.在修改完成后,您可以通过CGContextRestoreSCtate函数把堆栈顶部的状态弹出,返回之前的图形状态.这种推入和弹出是回到之前图形状态的快速方法,避免逐个撤销所有的状态修改;这也是将某些状态(比如裁剪路径)恢复到原有设置的唯一方式
CGContextSaveGState(context);
CGContextMoveToPoint(context, 220, 90);
CGContextAddLineToPoint(context, 240, 90);
CGContextAddLineToPoint(context, 240, 110);
CGContextAddLineToPoint(context, 220, 110);

CGContextClip(context);//context裁剪路径后续操作的路径 //，然后调用CGContextClip方法，而不是像之前那样填充它。以后的绘制动作都会被限定在那个区域中！
// CGContextDrawLinearGradient(CGContextRef  _Nullable c, CGGradientRef  _Nullable gradient, CGPoint startPoint, CGPoint endPoint, CGGradientDrawingOptions options)
//gradient渐变颜色 ,startPoint:开始渐变的起始位置,endpoint结束坐标 ,options开始坐标之前or开始之后开始渐变
CGContextDrawLinearGradient(context, gradient, CGPointMake(220, 90), CGPointMake(240, 110), kCGGradientDrawsAfterEndLocation);
CGContextRestoreGState(context);//恢复到之前的context

//再写一个看看效果
CGContextSaveGState(context);
CGContextMoveToPoint(context, 260, 90);//设置起点
CGContextAddLineToPoint(context, 280, 90);
CGContextAddLineToPoint(context, 280, 100);
CGContextAddLineToPoint(context, 260, 100);
CGContextClip(context);
//开始和结束坐标是控制渐变的方向和形状
CGContextDrawLinearGradient(context, gradient, CGPointMake(260, 90), CGPointMake(260, 100), kCGGradientDrawsAfterEndLocation);
CGContextRestoreGState(context);

//渐变的圆
 //CGContextDrawRadialGradient(CGContextRef  _Nullable c, CGGradientRef  _Nullable gradient, CGPoint startCenter, CGFloat startRadius, CGPoint endCenter, CGFloat endRadius, CGGradientDrawingOptions options)
//startCenter中心圆点(白色的起点)
//startRadius:起点的半径,这个值多大,中心就是多大一块纯色的白圈
//endCenter;白色的终点(可以和起点一样,不一样的话就像探照灯一样从起点投影到这个终点)
//endRadius:终点的半径
//CGGradientDrawingOptions options //应该是 kCGGradientDrawsBeforeStartLocation | kCGGradientDrawsAfterEndLocation
CGContextDrawRadialGradient(context, gradient, CGPointMake(300, 100), 5.0, CGPointMake(300, 100), 30, kCGGradientDrawsBeforeStartLocation);

pragma mark---画椭圆

//中心点坐标 160,180 宽度20 高度8
CGContextAddEllipseInRect(context, CGRectMake(160, 180, 20, 8));//椭圆
CGContextDrawPath(context, kCGPathFillStroke);

pragma mark---画三角形

//只要三个点就行跟画一条线的方式一样,把三个点连接起来
CGPoint sPoints[3];//坐标点
sPoints[0] = CGPointMake(100, 220);
sPoints[1] = CGPointMake(130, 220);
sPoints[2] = CGPointMake(130, 160);
CGContextAddLines(context, sPoints, 3);
CGContextClosePath(context);//封起来
CGContextDrawPath(context, kCGPathFillStroke);//根据坐标绘制路径

pragma mark ---画扇形

acolor = [UIColor colorWithRed:0 green:1 blue:1 alpha:1];
CGContextSetFillColorWithColor(context, acolor.CGColor);//填充颜色
//以10为半径围绕圆心画指定角度的扇形
CGContextMoveToPoint(context, 160, 180);
// CGContextAddArc(CGContextRef  _Nullable c, CGFloat x, CGFloat y,     CGFloat radius, CGFloat startAngle, CGFloat endAngle, int clockwise)
//1）startAngle为0,绿色箭头的地方。
//2）endAngle为45,黄色箭头的地方。
//3）clockwise为0,按照红色箭头往下绘制图形。
//4）所以效果就是红色的扇形。
// 补充：如果clockwise为1，则是蓝色部分区域
CGContextAddArc(context, 160, 180, 30, 0, 45 *(M_PI/ 180), 1);
CGContextClosePath(context);
CGContextDrawPath(context, kCGPathFillStroke);

pragma mark---画圆角矩形

float fw = 180;
float fh = 280;
CGContextMoveToPoint(context, fw, fh - 20);//开始坐标右边开始
CGContextAddArcToPoint(context, fw, fh, fw - 20, fh, 10);//右下角角度
CGContextAddArcToPoint(context, 120, fh, 120, fh - 20, 10);//左下角角度
CGContextAddArcToPoint(context, 120, 250, fw - 20, 250, 10);//左上角
CGContextAddArcToPoint(context, fw, 250, fw, fh -20, 10);//左上角
CGContextClosePath(context);
CGContextDrawPath(context, kCGPathFillStroke);

pragma mark ---画贝塞尔曲线

//二次曲线
CGContextMoveToPoint(context, 120, 300);//起点
CGContextAddQuadCurveToPoint(context, 190, 310, 120, 390);//设置贝塞尔曲线的控制点(最高点或最低点)坐标和终点坐标c
CGContextStrokePath(context);
//三个点确定一条曲线

//三次曲线函数
CGContextMoveToPoint(context, 200, 300);
CGContextAddCurveToPoint(context,250, 280, 250, 400, 280, 300);//设置贝塞尔曲线的控制的坐标和控制的终点坐标
CGContextStrokePath(context);

pragma mark ---图片

UIImage *image = [UIImage imageNamed:@"1.jpg"];
[image drawInRect:CGRectMake(60, 340, 20, 20)];//在坐标中画出图片(原图)第一张图
[image drawAtPoint:CGPointMake(100, 340)];///保持图片大小在point点开始画图片,第二张图

CGContextDrawImage(context, CGRectMake(100, 340, 20, 20), image.CGImage);//将原图进行上下颠倒,大小为(20,20),第三张图

pragma mark--解决图片上下颠倒的问题

UIGraphicsPushContext(context);
[image drawInRect:CGRectMake(0, 0, 20, 20)];
UIGraphicsPopContext();//第四张图