图形上下文(Graphics Context)---绘制目标

需要在iOS应用程序的屏幕上进行绘制时,需要先定义一个UIView类,并实现它的drawRect:方法,当启动程序时,会先调用loadView,然后是ViewDidLoad,接下来才是drawRect:方法。

1.画单条线

//1 获取上下文

CGContextRef context = UIGraphicsGetCurrentContext();

//2 创建一个绘制的路径

CGMutablePathRef path = CGPathCreateMutable();

//画线

//(1)设置起始点

CGPathMoveToPoint(path, NULL, 50, 50);

//(2)设置目标点

CGPathAddLineToPoint(path, NULL, 200, 200);

CGPathAddLineToPoint(path, NULL, 50, 200);

// CGPathAddLineToPoint(path, NULL, 50, 50);

//关闭路径(将路径封闭起来)

CGPathCloseSubpath(path);

//3 将路径添加到上下文

CGContextAddPath(context, path);

//4 设置上下文的属性

//设置填充颜色

CGContextSetRGBFillColor(context, 250/255.0, 200/255.0, 50/255.0, 1.0);

//设置线条颜色

CGContextSetRGBStrokeColor(context, 65/255.0, 170/255.0, 50/255.0, 1.0);

//设置线条宽度

CGContextSetLineWidth(context, 30);

//设置线条转折点的样式

CGContextSetLineJoin(context, kCGLineJoinRound);

//5 绘制路径

/*绘制模式:

kCGPathFill:填充(实心)

kCGPathStroke:只画线(空心)

kCGPathFillStroke:即画线又填充

*/

CGContextDrawPath(context, kCGPathFillStroke);

//6 释放路径

CGPathRelease(path);

2.画多条线

//1 获取上下文

CGContextRef context = UIGraphicsGetCurrentContext();

//2 添加多条线

CGPoint p0 = {50,50};

CGPoint p1 = {200,200};

CGPoint p2= {50,200};

CGPoint p3 = {50,50};

CGPoint points[] = {p0,p1,p2,p3};

CGContextAddLines(context, points, 4);

//3 设置属性

// CGContextSetRGBStrokeColor(context, 65/255.0, 170/255.0, 50/255.0, 1.0);

//---UIKit--------

//设置线条颜色

[[UIColor redColor] setStroke];

//设置填充颜色

[[UIColor blueColor]setFill];

//4 绘制路径

CGContextDrawPath(context, kCGPathFillStroke);

3.画矩形

//----------第一种:core Graphics-----------

//1 获取上下文

CGContextRef context = UIGraphicsGetCurrentContext();

//2 添加矩形

// CGRect rect = CGRectMake(40, 40, 100, 200);

// CGContextAddRect(context, rect);

//

//

// //3 设置属性

// [[UIColor redColor]setStroke];

//// [[UIColor orangeColor]setFill];

//

//

// //4 绘制

// CGContextDrawPath(context, kCGPathFillStroke);

//----------第二种:UIKit- 提供绘制矩形的函数 (已经封装好的)----------

[[UIColor redColor]setStroke];

[[UIColor orangeColor]setFill];

CGRect rect = CGRectMake(40, 40, 100, 200);

//绘制线条矩形(空心)

// UIRectFrame(rect);

//绘制填充的矩形(实心)

UIRectFill(rect);

4.画弧线

//1 获取上下文

CGContextRef context = UIGraphicsGetCurrentContext();

//-----------第一种: 绘制圆弧------------

/**

*

*

* @param context 上下文

* @param x#> 圆的中心点坐标x description#>

* @param y#> 圆的中心点坐标y description#>

* @param radius#> 圆的半径 description#>

* @param startAngle#> 开始的角度 description#>

* @param endAngle#> 结束的角度 description#>

* @param clockwise#> 画的方向 0 顺时针 1 逆时针

*

* @return <#return value description#>

*/

CGContextAddArc(context, 160, 100, 100, 0, M_PI_4, 0);

//设置属性

[[UIColor redColor]setStroke];

[[UIColor orangeColor]setFill];

//绘制

CGContextDrawPath(context, kCGPathFillStroke);

//-----------第二种: 绘制内切椭圆------------

CGRect rect = CGRectMake(50, 50, 200, 100);

//设置属性

[[UIColor blackColor]setStroke];

[[UIColor orangeColor]setFill];

//绘制线条矩形

UIRectFrame(rect);

//根据矩形绘制的椭圆

CGContextAddEllipseInRect(context, rect);

//绘制

CGContextDrawPath(context, kCGPathFillStroke);

5.画曲线

//1 获取上下文

CGContextRef context = UIGraphicsGetCurrentContext();

//1.设置起点

CGContextMoveToPoint(context, 20, 200);

//2 画贝塞尔曲线

//(1) 3个点

/*

<#CGContextRef _Nullable c#>:上下文

cp1x cp1y: 第一条切线的终点

cp2x cp2y: 第二条切线的起点

x y: 第二条切线的终点

*/

// CGContextAddCurveToPoint(context, 100, 20, 200, 300, 300, 50);

// //3 设置属性

// [[UIColor redColor] setStroke];

//

// //4 绘制

// CGContextDrawPath(context, kCGPathStroke);

//(2) 2个点

[[UIColor redColor] setStroke];

CGContextAddQuadCurveToPoint(context, 150, 20, 300, 200);

CGContextDrawPath(context, kCGPathStroke);

6.画文字

//1 获取上下文

CGContextRef context = UIGraphicsGetCurrentContext();

CGRect rect = CGRectMake(50, 50, 200, 50);

//绘制矩形

UIRectFrame(rect);

// UIFont *font = [UIFont systemFontOfSize:20];

/*lineBreakMode:换行的方式

NSLineBreakByWordWrapping:根据单词换行

NSLineBreakByCharWrapping:根据字符换行

*/

//绘制文字

// [str drawInRect:rect withFont:font lineBreakMode:NSLineBreakByCharWrapping alignment:NSTextAlignmentCenter];

//2 新方法:

//属性字典

NSDictionary *dic = @{

NSFontAttributeName:[UIFont systemFontOfSize:20],

NSBackgroundColorAttributeName:[UIColor greenColor],

NSForegroundColorAttributeName:[UIColor whiteColor]

};

[str drawInRect:rect withAttributes:dic];

7.画图

//1 获取上下文

CGContextRef context = UIGraphicsGetCurrentContext();

UIImage *image = [UIImage imageNamed:@"37.jpg"];

//----UKit-------

//1.指定一个点来绘制图片(锚点)

// [image drawAtPoint:CGPointMake(50, 50)];

// //2.制定一个矩形范围来绘制(拉伸填充)

// [image drawInRect:CGRectMake(0, 0, 200, 300)];

// //3.指定一个矩形范围平铺绘制

// [image drawAsPatternInRect:CGRectMake(0, 0, 200, 300)];

//

//二 core graphics

//1 保存上下文状态

CGContextSaveGState(context);

//2 切换坐标系

// Quartz 2D的坐标系----->UIKit的坐标系

//(1)向上平移一个高度

CGContextTranslateCTM(context, 0, 200);

//(2)改变Y轴的方向

CGContextScaleCTM(context, 1, -1);

//3 图片绘制

CGContextDrawImage(context, CGRectMake(0, 0, 300, 200), image.CGImage);

//4 恢复到之前保存的上下文状态

CGContextRestoreGState(context);

查看原文