在准备画板的时候一定要重写drawRect方法
常用的方法:
- CGContextRef 上下文
- 路径
1 UIBezierPath 贝塞尔路径
2 通过点绘制一条路径 CGMutablePathRef
3 注意必须设置一个起始点 CGContextMoveToPoint- 画形状
1 矩形 CGContextAddRect:
2 曲线 CGContextAddCurveToPoint
3 圆形 CGContextAddEllipseInRect- 截图
1 开始截图的方法 UIGraphicsBeginImageContextWithOptions
2 获得当前图片上下文的图片 UIGraphicsGetImageFromCurrentImageContext() -> 从画图的layer上得到的
3 UIGraphicsEndImageContext 关闭图片上下文
4 UIGraphicsBeginImageContext开始获得图片上下文
5 CGContextStrokePath 把路径绘制到上下文
6 直接把路径绘制到界面 stroke- 设置画笔
1 CGContextSetLineWidth 设置画笔宽度
2 setFill 设置画线区域范围的填充颜色
3 CGContextSetStrokeColor 设置画笔颜色
4 set 设置画笔颜色
5 设置画笔颜色填充模式
kCGPathFill, 只填充
kCGPathStroke,只显示画笔颜色
kCGPathFillStroke,既填充又有画笔
使用步骤
- 1 CGContextRef 上下文->画板
- 2 画图的内容 -> 设置画图的内容
- 3 把内容添加到上下文(画板)上
- 4 把内容画到画板上
代码示例
// Copyright © 2016年 安静SRR. All rights reserved.
//
#import "PaintingView.h"
@interface PaintingView ()
{
CGContextRef contextRef;
}
@end
@implementation PaintingView
//所有画图的方法 写在drawRect里面
//1、初始化的时候就会调用drawRect方法
//2、调用setNeedsDisplay的时候也会调用drawRect方法
-(void)drawRect:(CGRect)rect{
[super drawRect:rect];
[self addRound];
}
//画直线
-(void)addLine{
//1、创建画布上下文
//获得当前的上下文当做画布
CGContextRef context = UIGraphicsGetCurrentContext();
//2、创建画图的内容
UIBezierPath *path = [UIBezierPath bezierPath];
/*
Point 中心点
x 中心点x
y 中心点y
y不变 x从小值 - 大值 横向直线
*/
//2.1设置一个起始点
[path moveToPoint:CGPointMake(10, 50)];
//2.2添加其他点
[path addLineToPoint:CGPointMake(300, 50)];
[path addLineToPoint:CGPointMake(300, 350)];
//2.3设置画笔宽度
path.lineWidth = 2;
//2.4设置画笔颜色
//[[UIColor orangeColor]set];
//画笔颜色
[[UIColor whiteColor]setStroke];
//填充颜色
[[UIColor purpleColor]setFill];
//3、把内容《路径》添加到上下文<画布>
CGContextAddPath(context, path.CGPath);
//4、绘制(渲染)内容到画板(上下文)
// CGContextStrokePath(context);
//设置填充的样式
CGContextDrawPath(context, kCGPathFillStroke);
}
//添加矩形
-(void)addRect{
//1、创建画布
CGContextRef context = UIGraphicsGetCurrentContext();
//2、设置内容
CGContextAddRect(context, CGRectMake(10, 10, 100, 100));
//2.1设置画笔颜色
[[UIColor orangeColor]setStroke];
[[UIColor colorWithRed:1.0 green:0.382 blue:0.4795 alpha:1.0]setFill];
//2.2 设置画笔宽度;
CGContextSetLineWidth(context, 5);
//3、渲染内容到画板
// CGContextStrokePath(context);
// CGContextDrawPath(context, kCGPathFillStroke);
//把内容直接渲染到画布
CGContextStrokeRect(context, CGRectMake(10, 10, 100, 100));
}
//添加圆形
-(void)addRound{
//1、创建画布
contextRef = UIGraphicsGetCurrentContext();
//2、内容
CGContextAddEllipseInRect(contextRef, CGRectMake(20, 20, 100, 100));
//3、设置画笔颜色
[[UIColor whiteColor]set];
//渲染到画布
CGContextDrawPath(contextRef, kCGPathFillStroke);
}
//画曲线
-(void)addCurve
{
//1、创建画布
CGContextRef context = UIGraphicsGetCurrentContext();
//2、内容
UIBezierPath *path = [UIBezierPath bezierPath];
// [ moveToPoint:CGPointMake(10, 100)];
//绘制曲线
// [path addCurveToPoint:CGPointMake(20, 130) controlPoint1:CGPointMake(100, 200) controlPoint2:CGPointMake(300, 100)];
/**
* center 中心点
* radius 半径
* startAngle 开始的弧度
* endAngle 结束的弧度
* clockwise 是顺时针 还是逆时针
*/
[path addArcWithCenter:CGPointMake(200, 200) radius:100 startAngle:M_PI_2 endAngle:M_PI clockwise:YES];
[[UIColor redColor]setStroke];
[[UIColor yellowColor]setFill];
//3、把内容添加到画布上
CGContextAddPath(context, path.CGPath);
//4、渲染
CGContextDrawPath(context, kCGPathFillStroke);
}
//简化画线
-(void)addLine2{
//1、路径
UIBezierPath *path = [UIBezierPath bezierPath];
[path moveToPoint:CGPointMake(200, 200)];
[path addLineToPoint:CGPointMake(200, 500)];
[[UIColor whiteColor]set];
//2、画出内容
[path stroke];
}
//截屏
- (UIImage *)imageFromView
{
//1、获得图片的画布(上下文)
//2、画布的上下文
//3、设置截图的参数 截图
//4、关闭图片的上下文
//5、保存
UIGraphicsBeginImageContext(self.frame.size);
CGContextRef context = UIGraphicsGetCurrentContext();
[self.layer renderInContext:context];
//开始截图
UIImage *theImage = UIGraphicsGetImageFromCurrentImageContext();
//关闭截图上下文
UIGraphicsEndImageContext();
UIImageWriteToSavedPhotosAlbum(theImage,nil,nil,nil); //保存图片到相册
return theImage;
}
@end
备注:代码示例里面包括了画直线、画矩形、画圆形、画曲线、还有保存截图的方法。有兴趣的朋友可以研究一下。
这里面没有添加撤销的方法,在这里把思路说一下:因为画的线是存在数组里面的,可以添加一个响应事件,在这个响应事件里面添加移除数组元素的方法,这样就可以实现划线的撤消了
网友评论