手势锁与涂鸦画板

gestureLock(手势锁)实现步骤

  1. 布局控件:背景控件和手势锁控件
  2. 手势锁控件:
    • 子控件:循环增加9个按钮,设置属性(注意是选中状态不是高亮状态),根据九宫格布局位置
    • 选中实现:按钮的选中通过哪种方法都会有高亮状态的延迟,所以我们不让按钮与用户交互,而是通过触摸事件(touchesBegan和touchesMove),pointInside WithEvent 逐次判断点是否落在按钮上,若是,则选中并加入选中按钮数组,否则不选中。另外已经选中的不重复选中
    • 将按钮中心点连线:在drawRect中将按钮用线段连接起来
    • 将按钮与当前点连线:在touchesMove方法中,记录当前点的位置,要求重绘,在drawRect中,从最后一个点画出一条线到当前点
    • 保存密码及清空图案:松开手时,由于要记录密码,所以应该在创建按钮时绑定tag值,最后遍历数组,拼接字符串将密码保存下来;取消按钮选中,将选中按钮数组清空,重绘。

涂鸦画板实现步骤

涂鸦画板.png
  1. 布局控件(做好屏幕适配):上面的工具栏(通过toolBar布局),下面的绘图工具栏(IOS9之后可以用Stack View布局,IOS9之前就拖3个按钮,做好屏幕适配),中间的画板(继承UIView)
  • 画板画线功能:

    1. 通过手势来监听移动,开始监听时创建path,设置线宽,并加入到paths(因为要画多个图形)
    • 手势改变时,画线,由于是要将多个点连接起来,所以要记录下当前的path,不断的在self.path中画线,重绘
    • 拼接路径可以不在drawRect中,但渲染必须在,因为要显示在layer上下文中
    • drawRect中,要将paths中的path逐一画出来
  • 绘图工具栏:监听滑条栏和按钮,根据view.h提供的线宽和颜色,设置线宽和颜色。

    • 这里要注意,如果重绘时要将所有颜色画出来,必须写path的分类,增加颜色属性;在drawRect方法中,调用【path.color set】,将线段画出来;线宽不用的原因是,系统提供的path属性自带线宽
  • 在vc.m中,拖线监听功能实现。为了封装性,里面的实现的功能应该调用view.h提供的方法

    • 清除功能:将paths数组清空,重绘
    • 撤销功能:将最后一个path从数组中移除,重绘
    • 橡皮擦功能:设置path的颜色为白色
    • 保存功能:开启位图上下文,将layer图层通过renderInContext渲染到当前上下文中(即位图上下文),从图层中获取图片,保存到系统相册中
    • 照片功能:到系统相册中选择图片,通过modal跳转,选择完后回到画板,显出选择的图片,需要进行处理(示例中缺少提示,应该增加蒙板提示)
    • 处理图片功能:从相册中返回的图片
      • 传递给一个继承自UIView的处理图片类(里面有一个图片子控件,使得处理后的图片通过drawInRect方法绘制到画板时能跟处理时一样。若是直接用imageView处理,最后传回画板时,图片会被放大至全屏)
      • 增加手势进行调整,最后长按时,图片实现闪烁(通过动画设置透明度),通过位图上下文取出图片,通过通知返回处理后的图片,画到画板上;将图片加到paths数组中,在drawRect中,由于图片不能通过描线画出,要用[path isKindOfClass:[UIImage class]]判断,如果是图片,就[image drawInRect:rect]画出图片
保存功能
 // 渲染图层
[_drawView.layer renderInContext:UIGraphicsGetCurrentContext()];

// 保存图片到系统相册里
    // image:保存的图片
    // completionTarget:保存完成的监听者
    // completionSelector:保存完成的时候调用监听者的方法,该方法不能随便调用
//核心代码
    UIImageWriteToSavedPhotosAlbum(image, self, @selector(image:didFinishSavingWithError:contextInfo:), nil);
//
}

// 保存图片完成的时候必须调用下面方法
- (void)image:(UIImage *)image didFinishSavingWithError:(NSError *)error contextInfo:(void *)contextInfo
{
    if (error) {
        [MBProgressHUD showError:@"保存失败"];

    }else{
        [MBProgressHUD showSuccess:@"保存成功"];
    }
}
照片功能
// 选择照片
- (IBAction)pickerPhoto:(id)sender {

    // 进入系统的相册UIImagePickerController
    // 创建一个照片选择控制器

    UIImagePickerController *imagePickerVc = [[UIImagePickerController alloc] init];

    // 设置数据源
    imagePickerVc.sourceType = UIImagePickerControllerSourceTypeSavedPhotosAlbum;

    // 设置代理
    imagePickerVc.delegate = self;

    // modal
    [self presentViewController:imagePickerVc animated:YES completion:nil];
}

#pragma mark - UIImagePickerControllerDelegate
// 用户选择照片的时候调用
- (void)imagePickerController:(UIImagePickerController *)picker didFinishPickingMediaWithInfo:(NSDictionary *)info
{
    // 获取用户选择照片
    UIImage *image = info[UIImagePickerControllerOriginalImage];

    [self dismissViewControllerAnimated:YES completion:nil];

    // 处理下图片
    // 创建处理图片的view
    HandleImageView *hanldImageV = [[HandleImageView alloc] initWithFrame:_drawView.frame];
    [self.view addSubview:hanldImageV];

    // 给处理图片的view传递图片
    hanldImageV.image = image;
}
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 159,290评论 4 363
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,399评论 1 294
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 109,021评论 0 243
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 44,034评论 0 207
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,412评论 3 287
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,651评论 1 219
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,902评论 2 313
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,605评论 0 199
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,339评论 1 246
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,586评论 2 246
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,076评论 1 261
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,400评论 2 253
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,060评论 3 236
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,083评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,851评论 0 195
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,685评论 2 274
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,595评论 2 270

推荐阅读更多精彩内容

  • Quartz2D以及drawRect的重绘机制字数1487 阅读21 评论1 喜欢1一、什么是Quartz2D Q...
    PurpleWind阅读 730评论 0 3
  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 11,616评论 4 59
  • Quartz2D 简介 Quartz2D是二维(平面)的绘图引擎(经包装的函数库,方便开发者使用。也就是说苹果帮我...
    iOS_Cqlee阅读 608评论 0 2
  • 1.xcode5和xcode7区别 1.xcode7没有Frameworks文件夹,xcode7内部会自动帮你导入...
    彼岸的黑色曼陀罗阅读 461评论 0 2
  • 当难过受伤时,身边总会有那么几个人安慰你,给你出idea,替你痛骂几句社会真TM炒蛋,各种想方设法只是为了让你抿嘴...
    鱼鱼luck阅读 664评论 0 0