1.参考全面的博客：Bitmap Graphics Context
2.core graphic这个框架能实现的基本功能1.基本图形绘制
* 线段（线宽、线段样式）
* 矩形（空心、实心、颜色）
* 三角形、梯形等形状
* 椭圆/圆
* 圆弧
* 文字绘制
* 图片绘制（pattern）
* 图形上下文栈
2.练习（画人）
3.模仿UIImageView
4.自定义checkbox
5.图片裁剪
6.图片水印
7.条纹背景
8.截图
9.结尾总结，刷真的方法是setneeddisplay这个方法，也就是刷新的功能
10.如果有creat这个词就需要进行释放用cfrelease( )这个方法。
3.步骤
•在drawRect:方法中取得上下文后，就可以绘制东西到view上••View内部有个layer（图层）属性，drawRect:方法中取得的是一个Layer Graphics Context，因此，绘制的东西其实是绘制到view的layer上去了•
•View之所以能显示东西，完全是因为它内部的layer1.获得图形上下文CGContextRef ctx = UIGraphicsGetCurrentContext();
•2.拼接路径（下面代码是搞一条线段）CGContextMoveToPoint(ctx, 10, 10);
CGContextAddLineToPoint(ctx, 100, 100);
3.绘制路径CGContextStrokePath(ctx); // CGContextFillPath(ctx);
•新建一个起点void CGContextMoveToPoint(CGContextRef c, CGFloat x,CGFloat y)
•添加新的线段到某个点void CGContextAddLineToPoint(CGContextRef c, CGFloatx, CGFloat y)
•添加一个矩形void CGContextAddRect(CGContextRef c, CGRect rect)
•添加一个椭圆void CGContextAddEllipseInRect(CGContextRef context,CGRect rect)
•添加一个圆弧void CGContextAddArc(CGContextRef c, CGFloat x,CGFloat y,
CGFloat radius, CGFloat startAngle, CGFloat endAngle, intclockwise)
•Mode参数决定绘制的模式void CGContextDrawPath(CGContextRef c,CGPathDrawingMode mode)
•绘制空心路径void CGContextStrokePath(CGContextRef c)
•绘制实心路径void CGContextFillPath(CGContextRef c)
提示：一般以CGContextDraw、CGContextStroke、CGContextFill开头的函数，都是用来绘制路径的
•将当前的上下文copy一份,保存到栈顶(那个栈叫做”图形上下文栈”)void CGContextSaveGState(CGContextRef c)
•将栈顶的上下文出栈,替换掉当前的上下文
void CGContextRestoreGState(CGContextRef c)
4.具体例子
- (void)drawRect:(CGRect)rect
{
CGContextRef ctx = UIGraphicsGetCurrentContext();
CGContextSaveGState(ctx);
CGContextRotateCTM(ctx, M_PI_4 * 0.3);
CGContextScaleCTM(ctx, 0.5, 0.5);
CGContextTranslateCTM(ctx, 0, 150);
CGContextAddRect(ctx, CGRectMake(10, 10, 50, 50));
CGContextStrokePath(ctx);
CGContextRestoreGState(ctx);
CGContextAddEllipseInRect(ctx, CGRectMake(100, 100, 100, 100));
CGContextMoveToPoint(ctx, 100, 100);
CGContextAddLineToPoint(ctx, 200, 250);
// 矩阵操作
// CGContextScaleCTM(ctx, 0.5, 0.5);
CGContextStrokePath(ctx);
}
- (void)drawRect:(CGRect)rect
{
// 1.获得上下文
CGContextRef ctx = UIGraphicsGetCurrentContext();
// 将ctx拷贝一份放到栈中
CGContextSaveGState(ctx);
// 设置绘图状态
CGContextSetLineWidth(ctx, 10);
[[UIColor redColor] set];
CGContextSetLineCap(ctx, kCGLineCaPRound);
// 第1根线
CGContextMoveToPoint(ctx, 50, 50);
CGContextAddLineToPoint(ctx, 120, 190);
CGContextStrokePath(ctx);
// 将栈顶的上下文出栈,替换当前的上下文
CGContextRestoreGState(ctx);
// 第2根线
CGContextMoveToPoint(ctx, 10, 70);
CGContextAddLineToPoint(ctx, 220, 290);
CGContextStrokePath(ctx);
// CGContextDrawPath(ctx, kCGPathStroke);
}
#import "MJHumanView.h"
@implementation MJHumanView
- (void)drawRect:(CGRect)rect
{
// 1.上下文
CGContextRef ctx = UIGraphicsGetCurrentContext();
// 2.身体
drawBody(ctx, rect);
// 3.嘴(微笑)
drawZui(ctx, rect);
// 3.画眼睛
drawEyes(ctx, rect);
}
void drawEyes(CGContextRef ctx, CGRect rect)
{
// 1.黑色绑带
CGFloat startX = rect.size.width * 0.5 - MJRadius;
CGFloat startY = MJTopY;
CGContextMoveToPoint(ctx, startX, startY);
CGFloat endX = startX + 2 * MJRadius;
CGFloat endY = startY;
CGContextAddLineToPoint(ctx, endX, endY);
CGContextSetLineWidth(ctx, 15);
[[UIColor blackColor] set];
// 绘制线条
CGContextStrokePath(ctx);
// 2.最外圈的镜框
[MJColor(61, 62, 66) set];
CGFloat kuangRadius = MJRadius * 0.4;
CGFloat kuangY = startY;
CGFloat kuangX = rect.size.width * 0.5 - kuangRadius;
CGContextAddArc(ctx, kuangX, kuangY, kuangRadius, 0, M_PI * 2, 0);
CGContextFillPath(ctx);
// 3.里面的白色框
[[UIColor whiteColor] set];
CGFloat whiteRadius = kuangRadius * 0.7;
CGFloat whiteX = kuangX;
CGFloat whiteY = kuangY;
CGContextAddArc(ctx, whiteX, whiteY, whiteRadius, 0, M_PI * 2, 0);
CGContextFillPath(ctx);
}
void drawZui(CGContextRef ctx, CGRect rect)
{
// 中间的控制点
CGFloat controlX = rect.size.width * 0.5;
CGFloat controlY = rect.size.height * 0.4;
// 当前点
CGFloat marginX = 20;
CGFloat marginY = 10;
CGFloat currentX = controlX - marginX;
CGFloat currentY = controlY - marginY;
CGContextMoveToPoint(ctx, currentX, currentY);
// 结束点
CGFloat endX = controlX + marginX;
CGFloat endY = currentY;
// 贝塞尔曲线
CGContextAddQuadCurveToPoint(ctx, controlX, controlY, endX, endY);
// 设置颜色
[[UIColor blackColor] set];
// 渲染
CGContextStrokePath(ctx);
}
void drawBody(CGContextRef ctx, CGRect rect)
{
// 上半圆
CGFloat topX = rect.size.width * 0.5;
CGFloat topY = MJTopY;
CGFloat topRadius = MJRadius;
CGContextAddArc(ctx, topX, topY, topRadius, 0, M_PI, 1);
// 向下延伸
CGFloat middleX = topX - topRadius;
CGFloat middleH = 100; // 中间身体的高度
CGFloat middleY = topY + middleH;
CGContextAddLineToPoint(ctx, middleX, middleY);
// 下半圆
CGFloat bottomX = topX;
CGFloat bottomY = middleY;
CGFloat bottomRadius = topRadius;
CGContextAddArc(ctx, bottomX, bottomY, bottomRadius, M_PI, 0, 1);
// 合并路径
CGContextClosePath(ctx);
// 设置颜色
[MJColor(252, 218, 0) set];
// 利用填充方式画出之前的路径
CGContextFillPath(ctx);
}
- (void)drawRect:(CGRect)rect
{
// Drawing code
// 1.获得图形上下文
CGContextRef ctx = UIGraphicsGetCurrentContext();
// 2.拼接图形(路径)
// 设置线段宽度
CGContextSetLineWidth(ctx, 10);
// 设置线段头尾部的样式
CGContextSetLineCap(ctx, kCGLineCapRound);
// 设置线段转折点的样式
CGContextSetLineJoin(ctx, kCGLineJoinRound);
// 设置颜色
CGContextSetRGBStrokeColor(ctx, 1, 0, 0, 1);
// 设置一个起点
CGContextMoveToPoint(ctx, 10, 10);
// 添加一条线段到(100, 100)
CGContextAddLineToPoint(ctx, 100, 100);
// 渲染一次
CGContextStrokePath(ctx);
// 设置颜色
CGContextSetRGBStrokeColor(ctx, 0, 0, 1, 1);
// 设置一个起点
CGContextMoveToPoint(ctx, 200, 190);
// 添加一条线段到(150, 40)
CGContextAddLineToPoint(ctx, 150, 40);
CGContextAddLineToPoint(ctx, 120, 60);
// 3.渲染显示到view上面
CGContextStrokePath(ctx);
}
void draw4Rect()
{
// 1.获得上下文
CGContextRef ctx = UIGraphicsGetCurrentContext();
// 2.画矩形
CGContextAddRect(ctx, CGRectMake(10, 10, 150, 100));
// set : 同时设置为实心和空心颜色
// setStroke : 设置空心颜色
// setFill : 设置实心颜色
[[UIColor whiteColor] set];
// CGContextSetRGBFillColor(ctx, 0, 0, 1, 1);
// 3.绘制图形
CGContextFillPath(ctx);
}
void drawTriangle()
{
// 1.获得上下文
CGContextRef ctx = UIGraphicsGetCurrentContext();
// 2.画三角形
CGContextMoveToPoint(ctx, 0, 0);
CGContextAddLineToPoint(ctx, 100, 100);
CGContextAddLineToPoint(ctx, 150, 80);
// 关闭路径(连接起点和最后一个点)
CGContextClosePath(ctx);
//
CGContextSetRGBStrokeColor(ctx, 0, 1, 0, 1);
// 3.绘制图形
CGContextStrokePath(ctx);
}
- (void)drawRect:(CGRect)rect
{
// 1.获得上下文
CGContextRef ctx = UIGraphicsGetCurrentContext();
// 2.画1/4圆
CGContextMoveToPoint(ctx, 100, 100);
CGContextAddLineToPoint(ctx, 100, 150);
CGContextAddArc(ctx, 100, 100, 50, -M_PI_2, M_PI, 1);
CGContextClosePath(ctx);
[[UIColor redColor] set];
// 3.显示所绘制的东西
CGContextFillPath(ctx);
}
void drawArc()
{
// 1.获得上下文
CGContextRef ctx = UIGraphicsGetCurrentContext();
// 2.画圆弧
// x/y : 圆心
// radius : 半径
// startAngle : 开始角度
// endAngle : 结束角度
// clockwise : 圆弧的伸展方向(0:顺时针, 1:逆时针)
CGContextAddArc(ctx, 100, 100, 50, M_PI_2, M_PI, 0);
// 3.显示所绘制的东西
CGContextFillPath(ctx);
}
void drawCircle()
{
// 1.获得上下文
CGContextRef ctx = UIGraphicsGetCurrentContext();
// 2.画圆
CGContextAddEllipseInRect(ctx, CGRectMake(50, 10, 100, 100));
CGContextSetLineWidth(ctx, 10);
// 3.显示所绘制的东西
CGContextStrokePath(ctx);
}
- (void)drawRect:(CGRect)rect
{
drawImage();
}
void drawImage()
{
// 1.取得图片
UIImage *image = [UIImage imageNamed:@"me"];
// 2.画
// [image drawAtPoint:CGPointMake(50, 50)];
// [image drawInRect:CGRectMake(0, 0, 150, 150)];
[image drawaspatternInRect:CGRectMake(0, 0, 200, 200)];
// 3.画文字
NSString *str = @"为xxx所画";
[str drawInRect:CGRectMake(0, 180, 100, 30) withAttributes:nil];
}
void drawText()
{
// 1.获得上下文
CGContextRef ctx = UIGraphicsGetCurrentContext();
// 2.画矩形
CGRect cubeRect = CGRectMake(50, 50, 100, 100);
CGContextAddRect(ctx, cubeRect);
// 3.显示所绘制的东西
CGContextFillPath(ctx);
// 4.画文字
NSString *str = @"哈哈哈哈Good morning hello hi hi hi hi";
// [str drawAtPoint:CGPointZero withAttributes:nil];
NSMutableDictionary *attrs = [NSMutableDictionary dictionary];
// NSForegroundColorAttributeName : 文字颜色
// NSFontAttributeName : 字体
attrs[NSForegroundColorAttributeName] = [UIColor redColor];
attrs[NSFontAttributeName] = [UIFont systemFontOfSize:50];
[str drawInRect:cubeRect withAttributes:attrs];
}
