基本图形绘制Quartz2d的的使用

QuartZ2d是二维绘图引擎,包含在core Graphics框架中,是纯C语言的;

图形上下文:CGContextRef数据类型,包含以下信息:绘图路径,绘图状态,绘图输出目标;

注意:绘图的顺序对最终显示结果有影响;

1.当view第一次被显示的时候会调用d'ra'wRect:(CGRect )rect

2.不要手动调用drawRect:方法执行重绘,否则可能无法正确的获取图形上下文;

3.手动调用重绘的方法:setNeedsDisplay(全部重绘),steedsDisplayInRect(部分区域重绘);

4.rect表示当前view的bounds

5.只有在drawrect:方法中能获取当前view的图形上下文;

6.手动调用重绘的时候,内部会创建一个与当前view相关的图形上下文,然后再调用drawRect:方法实现重绘,绘制的的图形实际上是绘制到了view的图层上;

渲染模式:

空心-------strokePath

实心---------fillPath

填充--------EOFillPath

[path stroke];

CGContextDrawPath(ctx,KCGPathStroke);

CGContextStrokePath(ctx);

填充一个路径的时候,路径里面的子路径是独立填充的;决定一个点事否被填充有两个规则:

1.非零计数规则:一个点从左到右跨过,计数器+1,从右到左跨过计数器-1;结果为零就不填充,结果不为零就填充;

2.奇偶规则:一个点被跨过奇数次,就被填充,被跨过偶数次就不填充,和方向没关系.

==============================================

//1.获取图形上下文对象

CGContextRef ctx =UIGraphicsGetCurrentContext();

//2.向图形上下文对象中添加路径

CGContextMoveToPoint(ctx,50,50);

//2.1添加线段

CGContextAddLineToPoint(ctx,150,150);

CGContextAddLineToPoint(ctx,50,150);

// CGContextAddLineToPoint(ctx, 50, 50);

//关闭路径 (终点到起点连线)

CGContextClosePath(ctx);

//2.2
重新设置起点

CGContextMoveToPoint(ctx,50,200);

CGContextAddLineToPoint(ctx,200,200);

绘制矩形路径,向上下文对象中添加路径

CGContextAddRect(ctx,CGRectMake(50,50,150,
150));

//3.渲染
CGContextStrokePath(ctx);//空心

CGContextFillPath(ctx);//填充

================================

UIBezierPath是UIKit框架封装好的框架;

//1.获取上下文对象

CGContextRef ctx =UIGraphicsGetCurrentContext();

//2.创建UIBezierPath对象

UIBezierPath * path = [UIBezierPathbezierPathWithRect:CGRectMake(50,50,100,
100)];

//3.把创建的UIBezierPath对象添加到上下文对象中

CGContextAddPath(ctx, path.CGPath);//转换成CGPath

//4.渲染

CGContextDrawPath(ctx,kCGPathFill);

==========================
不用获取图形上下文,直接绘制

//1.创建UIBezierPath对象

UIBezierPath * path = [UIBezierPathbezierPathWithRect:CGRectMake(100,100,100,
100)];

//2.渲染

[path fill];

=======================================
创建UIBezierPath.并添加子路径

//1.获取图形上下文对象

CGContextRef ctx =UIGraphicsGetCurrentContext();

//2.创建UIBezierPath路径对象

UIBezierPath * path = [UIBezierPathbezierPath];

//2.1
添加子路径

//2.1.1
设置起点

[path moveToPoint:CGPointMake(50,50)];

//2.1.2
添加线段

[path addLineToPoint:CGPointMake(200,200)];

//2.1.3
再添加一个线段

[path addLineToPoint:CGPointMake(50,200)];

//关闭路径

[path closePath];

//3.把创建好的UIBezierPath对象添加到图形上下文中

CGContextAddPath(ctx, path.CGPath);

//4.渲染

CGContextDrawPath(ctx,kCGPathStroke);

======================================================

//通过画弧的方式绘制圆

//1.获取图形上下文对象

CGContextRef ctx =UIGraphicsGetCurrentContext();

//2.创建路径

//设置圆心

CGPoint centerP =
CGPointMake(150,
150);

//设置半径

CGFloat radius =
100.f;

//设置起始弧度

CGFloat start =
0;

//设置结束弧度

CGFloat end =
M_PI_4;

UIBezierPath * path = [UIBezierPathbezierPathWithArcCenter:centerPradius:radiusstartAngle:startendAngle:endclockwise:YES];

//添加一条到圆心的线

[path addLineToPoint:centerP];

//关闭路径

[path closePath];

//3.把路径添加到图形上下文对象中

CGContextAddPath(ctx, path.CGPath);

//4.渲染

CGContextDrawPath(ctx,kCGPathFill);

======================================================

绘制矩形:OC中的方法

UIBezierPath * path = [UIBezierPathbezierPathWithRect:CGRectMake(50,50,100,
100)];

//绘制矩形方法一:

UIBezierPath * path = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(50, 50, 200, 200)];

//绘制矩形放法二:

高度为1, 居中的矩形

UIRectFill(CGRectMake(0, rect.size.height *
0.5, rect.size.width,
1));
//绘制矩形方法三:
一个点一个点的画;

//绘制矩形方法四:CGContextAddRect(ctx,CGRectMake(,,,));

==================

绘制圆角矩形:

UIBezierPath * path = [UIBezierPathbezierPathWithRoundedRect:CGRectMake(50,50,200, 200)cornerRadius:100];

绘制圆弧:

UIBezierPath * path = [UIBezierPath bezierPathWithArcCenter:圆心 radius:半径 startAngle:起始弧度 endAngle:结束弧度 clockwise:YES];//YES表示顺时针

+++++++++++++++++++++++++++++++++++++++++++

绘制圆/椭圆:(C语言的方法)

CGContextAddEllipseInRect(ctx, CGRectMake(50, 50, 200, 200));

绘制矩形:

CGContextAddRect(ctx, CGRectMake(50, 50, 150, 150));

绘制圆弧/圆:
CGContextAddArc(ctx, );

绘制填充样式的椭圆:

CGContextFillEllipseInRect(ctx, );

总结:绘制圆形的方法有:圆弧,椭圆,圆角矩形都可以画出圆形;

==========================

绘图状态的设置:

设置线宽:

CGContextSetlineWidth(ctx,20);

path.lineWidth =20;

[path setLineWidth:20];

设置线的颜色:

CGContextSetRGBStrokeColor(cox,1,0,1,1);

CGContextSetStrokeColorWithColor(context, [UIColorredColor].CGColor);

[[UIColor redColor] setStroke];//设置stroke时的颜色

[[UIColor redColor] setFill];//设置填充颜色

[[UIColorredColor]set];//不管是空心还是填充都有效果

设置线头样式:
CGContextSetLineCap(ctx,KCGlineCapButt);

path.lineCapStyle = kCGLineCapSquare;
[path setLineCapStytle:KCGLineCapRound];

//设置连接处样式

CGContextSetLineJoin(ctx,kCGLineJoinRound);

path.lineJoinStyle =kCGLineJoinBevel;
[path setLineJoinStytle:KCGLineJoinBevel];

==============================

图形上下文矩阵操作-----------可以让图形上下文中的路径一起变化

//缩放 CGContextScaleCTM(ctx, 0.5, 0.5);

//旋转 CGContextRotateCTM(ctx, M_PI_4);

//平移 CGContextTranslateCTM(ctx, 200, 50);

=============================================
图像上下文栈的操作:

两个钟要的方法:

//1.获取图形上下文对象

CGContextRef ctx = UIGraphicsGetCurrentContext();
2.

//在下一次绘图之前替换掉当前的图形上下文状态

CGContextRestoreGState(ctx);

例如:

//1.获取图形上下文对象

CGContextRef ctx =UIGraphicsGetCurrentContext();

//在绘图之前保存当前上下文状态

CGContextSaveGState(ctx);

//矩阵操作

//缩放

CGContextScaleCTM(ctx,0.5,0.5);

//旋转

CGContextRotateCTM(ctx,M_PI_4);

//平移

CGContextTranslateCTM(ctx,200,50);

//2.创建路径

UIBezierPath * path1 = [UIBezierPathbezierPathWithRect:CGRectMake(20,50,240,
100)];

UIBezierPath * path2 = [UIBezierPathbezierPathWithOvalInRect:CGRectMake(50,180,100,
50)];

UIBezierPath * path3 = [UIBezierPathbezierPathWithArcCenter:CGPointMake(150,150)radius:100startAngle:0endAngle:2*M_PIclockwise:YES];

//3.把路径添加到图形上下文对象中

CGContextAddPath(ctx, path1.CGPath);

CGContextAddPath(ctx, path2.CGPath);

CGContextAddPath(ctx, path3.CGPath);

//3.1或一条线段

// CGContextMoveToPoint(ctx, 50, 100);

//

// CGContextAddLineToPoint(ctx, 100, 200);

CGContextSetLineWidth(ctx, 20);

[[UIColor redColor] set];

//4.渲染

CGContextDrawPath(ctx, kCGPathStroke);

//--------再画一个矩形--------

//在下一次绘图之前替换掉当前的图形上下文状态

CGContextRestoreGState(ctx);

UIBezierPath * path4 = [UIBezierPath bezierPathWithRect:CGRectMake(50,250,50,
30)];

CGContextAddPath(ctx, path4.CGPath);

[[UIColor greenColor] set];

CGContextSetLineWidth(ctx, 10);

CGContextDrawPath(ctx, kCGPathStroke);

//--------再画一个矩形--------

====================================================================