一、效果图:

二、选择颜色:

分【固定颜色模式】和【自由取模式】。

 三、操作栏功能:

1、撤销:撤销上一步操作,可一直往上进行,直到全部清空。

2、清空:直接清除所有绘画。

3、橡皮擦:去除不要的绘画部分。

4、保存:一键保存相册。

四、实现方式:

贝塞尔曲线结合drawrect绘画。

代码结构:

核心代码模块:

#pragma mark - 画画
-(void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event
{
UITouch *touch = [touches anyObject];
CGPoint currentPoint = [touch locationInView:self];
self.bezierPath = [[YJBezierPath alloc] init];
self.bezierPath.lineColor = self.lineColor;
self.bezierPath.isErase = self.isErase;
[self.bezierPath moveToPoint:currentPoint]; [self.beziPathArrM addObject:self.bezierPath]; } -(void)touchesMoved:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{ UITouch *touch = [touches anyObject];
CGPoint currentPoint = [touch locationInView:self]; CGPoint previousPoint = [touch previousLocationInView:self];
CGPoint midP = midpoint(previousPoint,currentPoint);
// 这样写不会有尖头
[self.bezierPath addQuadCurveToPoint:currentPoint controlPoint:midP];
[self setNeedsDisplay]; } -(void)touchesEnded:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{
UITouch *touch = [touches anyObject];
CGPoint currentPoint = [touch locationInView:self];
CGPoint previousPoint = [touch previousLocationInView:self];
CGPoint midP = midpoint(previousPoint,currentPoint);
[self.bezierPath addQuadCurveToPoint:currentPoint controlPoint:midP];
// touchesMoved
[self setNeedsDisplay]; }
-(void)drawRect:(CGRect)rect{
if (self.beziPathArrM.count) {
for (YJBezierPath *path in self.beziPathArrM) {
if (path.isErase) {
[self.backgroundColor setStroke];
}else{
[path.lineColor setStroke];
} path.lineCapStyle = kCGLineCapRound;
path.lineJoinStyle = kCGLineCapRound;
if (path.isErase) {
path.lineWidth = ; // 这里可抽取出来枚举定义
[path strokeWithBlendMode:kCGBlendModeDestinationIn alpha:1.0];
}else{
path.lineWidth = ;
[path strokeWithBlendMode:kCGBlendModeNormal alpha:1.0];
}
[path stroke];
}
} [super drawRect:rect];
}

外部引用代码:

#import "BaiBanViewController.h"
#import "BaibanView.h" @interface BaiBanViewController ()
@property (nonatomic,strong) BaibanView *baibanV; @end @implementation BaiBanViewController -(BaibanView *)baibanV{
if(_baibanV==nil){
_baibanV=[[BaibanView alloc] initWithFrame:CGRectMake(, , KScreenWidth, KScreenHeight - )];
}
return _baibanV;
} - (void)viewDidLoad {
[super viewDidLoad];
self.navigationItem.title = @"画 板";
[[UIBarButtonItem appearance] setBackButtonTitlePositionAdjustment:UIOffsetMake(, -) forBarMetrics:UIBarMetricsDefault];
self.view.backgroundColor = [UIColor whiteColor]; //添加画板功能
[self.view addSubview:self.baibanV]; }

简单吧~

五、源码获取:

我直接把我的测试Demo放上去了,大家下载后,直接定位画板功能即可。

《点击这里获取全部源码》

========================更新于2017年==========================

上面那种方式,是利用drawrect方式绘画,通过cpu渲染,所以一定程度上比较耗cpu,内存也有一定上升

因此,如果你的应用不需要橡皮擦功能,只需要上一步或下一步这种的撤销操作,可以利用CAShapeLayer集合来实现,原理如下:

每一笔都是一个layer,然后一层层叠加在底view上,并记录到一个list里,这样,上一步和下一步都是直接对一个layer进行add或remove,简单明了,而且这种对于,绘画特殊图形也比较方便(比如画圆、矩形等)

下图是我另一个应用的涂鸦功能截图,这种对内存和cpu消耗特别低,而且集成了缩放、旋转功能, 大家可以借鉴一下。

但这种实现,如果需要橡皮擦功能,只能实现橡皮擦擦除区域与layer有交汇点,就清除layer(类似苹果相册编辑里的橡皮擦功能),如果想实现任意清除, 我暂时没想到特别好的解决方式。

iOS实现白板、画板功能,有趣的涂鸦工具,已封装,简单快捷使用的更多相关文章

  1. iOS之开发支付功能概述

    前言:本随笔将对IOS开发的支付功能进行一个概述. 内容大纲: 一.常见的支付方案简介 二.第三方支付SDK 三.苹果官方支付方案 四.Web支付方案 正文: 一.常见的支付方案简介 在微信支付中 微 ...

  2. IOS开发之支付功能概述

    前言:本随笔将对IOS开发的支付功能进行一个概述. 内容大纲: 一.常见的支付方案简介 二.第三方支付SDK 三.苹果官方支付方案 四.Web支付方案 正文: 一.常见的支付方案简介 在微信支付中 微 ...

  3. iOS项目开发常用功能静态库

    YHDeveloperTools iOS项目开发常用功能静态库 查看源码 功能方法: 1.字符检查 [NSString checkStringWithType:Email andTargetStrin ...

  4. iOS的录屏功能

    iOS的录屏功能其实没什么好说的,因为网上的教程很多,但是网上的Demo无一例外几乎都有一个bug,那就是iPad上会出现闪退,这也体现了国内的教程文档的一个特点,就是抄袭,教程几乎千篇一律,bug也 ...

  5. iOS开发UI篇—使用picker View控件完成一个简单的选餐应用

    iOS开发UI篇—使用picker View控件完成一个简单的选餐应用 一.实现效果 说明:点击随机按钮,能够自动选取,下方数据自动刷新. 二.实现思路 1.picker view的有默认高度为162 ...

  6. 每位iOS开发者不容错过的10大有用工具

    内容简单介绍 1.iOS简单介绍 2.iOS开发十大有用工具之开发环境 3.iOS开发十大有用工具之图标设计 4.iOS开发十大有用工具之原型设计 5.iOS开发十大有用工具之演示工具 6.iOS开发 ...

  7. ios开发UI篇—使用纯代码自定义UItableviewcell实现一个简单的微博界面布局

    本文转自 :http://www.cnblogs.com/wendingding/p/3761730.html ios开发UI篇—使用纯代码自定义UItableviewcell实现一个简单的微博界面布 ...

  8. XML真正强大的功能是来自其元素与封装的内容

    创建文档类型声明 一般而言,XML声明放在文档顶部.在PHP中声明十分简单:只需实例化一个DOM文档类的对象并赋予它一个版本号.查看程序清单A: 程序清单 A <?php// create do ...

  9. iOS开发UI篇—Date Picker和UITool Bar控件简单介绍

    iOS开发UI篇—Date Picker和UITool Bar控件简单介绍 一.Date Picker控件 1.简单介绍: Date Picker显示时间的控件 有默认宽高,不用设置数据源和代理 如何 ...

随机推荐

  1. CentOS 7.0 安装配置 kafka 消息队列

    查询下载最新版本 kafka http://kafka.apache.org/downloads.html wget http://mirror.bit.edu.cn/apache/kafka/0.8 ...

  2. heritrix1.14.4配置-没有add和change按钮的问题

    今天搞了下heritrix1.14.4在eclipse下的配置,根据http://www.360doc.com/content/10/0913/18/2793979_53385587.shtml教程, ...

  3. Linux监控体系

    监控体系 zabbix 博客:www.abcdocker.com 微信公众号:abcdocker 笔者QQ:381493251 Abcdocker交流群:454666672 如果遇到什么问题可以进群询 ...

  4. winscp 秘钥登录

    如题 如果不想用密码登录,可以选择用秘钥文件登录winscp 原理和linux分发ssh公钥是一个道理 1:在被管理的机器上分发公钥 ,出现 authorized_keys才可以 完成服务端配置 2: ...

  5. 关于css中的border

    我一直以为css中的border是正方形的 像这样 因为我平时用的时候都是 border:1px solid #000,都是同一个颜色所以看不出来 当我给每一个边分别设置颜色的时候才发现 他们是以梯形 ...

  6. linux 下source、sh、bash、./执行脚本的区别

    原文地址:http://blog.csdn.net/caesarzou/article/details/7310201 source命令用法: source FileName 作用:在当前bash环境 ...

  7. delphi的ArrayList

    本文转载自Top.hand<delphi的ArrayList>   delphi可以用Classes.TList类来实现ArrayList功能.注意:add()方法存入的类型是TPoint ...

  8. codeforces 755D. PolandBall and Polygon

    D. PolandBall and Polygon time limit per test 4 seconds memory limit per test 256 megabytes input st ...

  9. 封装bt轮播图淡入淡出效果样式

    <!--BT轮播图-->    <div data-ride="carousel" class="carousel slide carousel_inn ...

  10. PHP实现验证码图片

    <?php header("Content-type: image/png"); session_start(); $authnum = ''; $str = 'abcdef ...