IOS 图形绘制
// 定义COLOR1 常量
// 后面代码COLOR1, COLOR2 都是指本处的常量
#define COLOR1 [UIColor colorWithRed:1.0 green:0.2 blue:0.31 alpha:1.0]
#define COLOR2 [UIColor colorWithRed:0.5 green:0.2 blue:0.51 alpha:1.0]
绘制直线
// drawRect 可以通过实例化执行setNeedsDisplay方法手动触发调用
// drawRect 方法在类进行实例化时候都会调用,可以不适用setNeedsDisplay方法手动调用
- (void)drawRect:(CGRect)rect {
// 获取当前的图形上下文
CGContextRef context = UIGraphicsGetCurrentContext();
// 设置绘制的颜色
[COLOR1 setStroke];
// 设置线条的宽度
CGContextSetLineWidth(context, 2.0);
// 设置线条绘制的起始点
CGContextMoveToPoint(context, 100, 200);
// 添加线条路径
CGContextAddLineToPoint(context, 100, 300);
// 执行绘制路径操作
CGContextStrokePath(context);
}
矩形绘制
//
// setFill 方法表示矩形内部填充的颜色, 通过CGContextDrawPath完成
- (void) drawCustomRect {
CGContextRef context = UIGraphicsGetCurrentContext();
[COLOR2 setFill];
CGContextSetLineWidth(context, 2.0);
// 添加矩形坐标和长宽
CGContextAddRect(context, CGRectMake(100, 400, 100, 200));
// CGContextStrokePath(context);
CGContextDrawPath(context, kCGPathFillStroke);
}
三角形绘制
CGContextRef context = UIGraphicsGetCurrentContext();
[COLOR2 setFill];
CGContextSetLineWidth(context, 2.0);
// 创建一个可变路径
CGMutablePathRef pathRef = CGPathCreateMutable();
// 添加三个绘制坐标
CGPathMoveToPoint(pathRef, nil, 100, 200);
CGPathAddLineToPoint(pathRef, nil, 200, 300);
CGPathAddLineToPoint(pathRef, nil, 0, 30);
// 将路径添加到上下文
CGContextAddPath(context, pathRef);
// CGContextStrokePath(context);
// 执行图形的绘制
CGContextDrawPath(context, kCGPathFillStroke);
任意弧形绘制
CGContextRef context = UIGraphicsGetCurrentContext();
[COLOR2 setFill];
CGContextSetLineWidth(context, 2.0);
// 创建一个可变路径
CGMutablePathRef pathRef = CGPathCreateMutable();
// 添加三个绘制坐标
CGPathMoveToPoint(pathRef, nil, 100, 200);
CGContextAddCurveToPath(context, 200, 100, 200, 300, 300, 200);
CGContextAddPath(context, pathRef);
// CGContextStrokePath(context);
// 执行图形的绘制
CGContextDrawPath(context, kCGPathFillStroke);
圆形绘制
CGContextRef context = UIGraphicsGetCurrentContext();
[COLOR1 setFill];
CGContextSetLineWidth(context, 2.0);
// 绘制圆形使用的方法:
//
// CGContextAddArc(<#CGContextRef _Nullable c#>, <#CGFloat x#>, <#CGFloat y#>,
// <#CGFloat radius#>, <#CGFloat startAngle#>, <#CGFloat endAngle#>, <#int clockwise#>)
// x, y: 表示圆心的位置
// radius: 表示圆的半径长度
// startAngle: 起始的弧度(0-M_PI*2)
// endangle: 结束的弧度
// clockwise: 绘制的方向,0表示顺时针,1表示逆时针
//
// 绘制半圆只需要将弧度改为M_PI即可
// 通过CGContextClosePath(content); 将半圆闭合
CGContextAddArc(context, 200, 200, 150, 0, M_PI*2, 0);
CGContextAddPath(context, pathRef);
CGContextDrawPath(context, kCGPathFillStroke);
绘制的属性
// CGContextSetLineCap(context, KCGLineCapRound);
// 设置线条的两端的形状,KCGLineCapRound表示两端线条以弧度的形式绘制
//
// CGContextSetLineJoin(context, KCGLineJoinRound);
// 设置两个线条连接转折处的尖锐程度,KCGLineJoinRound表示线条以弧度方式转弯
//
- (void) drawRect:(CGRect) rect {
CGContextRef context = UIGraphicsGetCurrentContext();
[COLOR1 setStroke];
CGContextSetLineWidth(context, 2.0);
CGContextSetLineCap(context, KCGLineCapRound);
CGContextSetLineJoin(context, KCGLineJoinRound);
CGContextMoveToPoint(context, 100, 200);
CGContextAddLineToPoint(context, 100, 300);
CGContextStrokePath(context);
}
虚线的绘制
//
//
- (void) drawRect:(CGRect) rect {
CGContextRef context = UIGraphicsGetCurrentContext();
[COLOR1 setStroke];
CGContextSetLineWidth(context, 2.0);
CGFloat length[] = {10, 30, 10};
// 第一个参数:context上下文
// 第二个参数:绘制虚线的起始点
// 第三个参数:数组的名称
// 第四个参数:数组的长度
CGContextSetLineDash(context, 0, length, 3);
CGContextMoveToPoint(context, 100, 200);
CGContextAddLineToPoint(context, 100, 300);
CGContextStrokePath(context);
}
UIView drawRect方法的调用条件
- 单纯调用init方法不会触发drawRect方法的执行
- 通过设置frame,可以触发drawRect方法的执行,比如initWithFrame方法初始化会自动触发drawRect执行
- 调用setNeedsDisplay方法会触发drawRect方法的执行(可以用来动态刷新界面的显示效果)
图片的绘制
//
// 通过drawRect方法来绘制图片
UIImage *image = [UIImage imageNamed:@"1.png"];
// 在指定坐标点绘制图片
[image drawAtPoint:CGPointMake(100, 100)];
// 在指定坐标点矩形内绘制图片,图片会拉伸
[image drawInRect:CGRectMake(100, 100, 300, 600)];
// 在指定位置矩形内填充图片,将通过纹理的方式填充多张图片
[image drawAsPatternInRect:CGRectMake(100, 100, 300, 600)];
图片的裁剪
//
// AddEllipse 在指定位置以及宽高添加一个椭圆裁剪区域, 如果宽高一致,表示一个圆形
// CGContextClip 执行裁剪操作
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSaveGState(context);
CGContextAddEllipseInRect(context, CGRectMake(150, 150, 60, 60));
CGContextClip(context);
CGContextFillPath(context);
UIImage *img = [UIImage imageNamed:@"1.png"];
[img drawAtPoint:CGPointMake(150, 150)];
CGContextFillPath(context);
CGContextRestoreGState(context);
文字Logo的绘制
//
//
NSString *str = @"hello world.";
// UIImage *img = [UIImage imageNamed:@"1.png"];
// [img drawAtPoint:CGPointMake(100, 100)];
// 自定义文字log属性, 设置文字大小以及文字截断的风格和颜色
NSMutableParagraphStyle *paragraphStyle = [[NSMutableParagraphStyle defaultParagraphStyle] mutableCopy];
paragraphStyle.lineBreakMode = NSLineBreakByClipping;
NSDictionary *dic = @{NSFontAttributeName:[UIFont systemFontOfSize:10.0],
NSParagraphStyleAttributeName:paragraphStyle,
NSForgroundColorAttributeName:[UIColor greenColor]};
// 执行字符串的绘制
[str drawInRect:CGRectMake(100, 100, 100, 10) withAttributes:dic];