iOS手势解锁

------------- 基本思路 --------------

    1. 搭建界面,九宫格算法
    1. 处理按钮选中状态
    1. 按钮之间画线
    1. 手指和按钮之间画线
    1. 判断解锁密码是否正确
      ------------- 基本思路 --------------
  1. 拖拽图片素材

  2. 设置控制器 view 的背景色为"HomeButtomBG"图片平铺后的效果
    self.view.backgroundColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"HomeButtomBG"]];

  3. 在控制器中拖拽一个 UIView, 设置宽高都是300, 并设置约束(在父容器中水平、垂直居中对齐)。

  4. 自定义一个 view, 设置这个自定义 view 与界面上的 view 相关联

  5. 在自定义 view 中添加一个 buttons 属性, 在懒加载中生成9个 UIButton, 并且把这写 Button 都添加到 view 中。

  • 创建每个 UIButton
  • 设置每个 UIButton的默认情况下的背景图片、 selected 下的背景图片、disabled 下的背景图片
  1. 在 layoutSubviews 方法中根据九宫格的方式计算每个按钮的 frame

  2. 实现触摸到某个按钮的时候, 让这个按钮的状态变成 selected
    7.1 在自定义 view 的 touchesBegan:方法中根据当前的触摸点, 判断是否触碰到了某个按钮

  • 设置这个按钮的 selected状态
  • 把这个按钮记录下来(添加到 selectedButtons 集合中)

7.2 在自定义 view 的 touchesMoved:方法中根据当前的触摸点, 判断是否触碰到了某个按钮

  • 设置这个按钮的 selected状态
  • 把这个按钮记录下来(添加到 selectedButtons 集合中), 同时要判断这个按钮是否已经是 selected = YES了, 避免重复添加。
  • 同时记录下本次触摸的 point到 currentPoint属性中。
    ** 注意: 此处必须设置按钮禁止与用户交互(btn.userInteractionEnabled = NO;), 否者手指触摸到按钮上以后, 按钮会捕获这个触摸事件, 就不会触发 view的 touchesBegan:事件了。
  1. 在 drawRect:方法中绘制线条
  • 判断如果 self.selectedButtons长度为0, 那么直接返回不需要绘制任何内容
  • 如果 self.selectedButtons长度不为0:
    1> 循环 self.selectedButtons集合中的每个按钮
    2> 判断如果是第一个按钮那么移动到起点(起点为第一个按钮的 center point)
    3> 如果不是第一个按钮那么直接添加线段到这个按钮的 center point
    4> 绘制完毕按钮以后, 最后再添加一条线段到 currentPoint。
// 线条的颜色
#define SteveZLineColor [UIColor colorWithRed:0.0 green:170/255.0 blue:255/255.0 alpha:1.0]

/** 

 错误:
 <Error>: void CGPathAddLineToPoint(CGMutablePathRef, const CGAffineTransform *, CGFloat, CGFloat): no current point.

 原因:
 在第一次绘图的时候 path 对象中没有任何点
 
 解决:(判断如果没有需要绘制的按钮, 那么就直接返回)
 if (self.selectedButtons.count == 0) {
    return;
 }
 
 */
  1. 在touchesEnded:方法中, 将所有按钮的 selected 状态设置为 NO, 清空 self.selectedButtons 集合, 重新绘制。

  2. 为每个按钮添加一个 tag, 用来判断手势解锁是否正确

  • 通过代理把解锁的密码传递给控制器, 在控制器中判断解锁是否正确, 如果正确代理方法返回 YES, 否则返回 NO
  • 在定义 view 中, 根据代理方法返回的结果判断如果 YES, 那么直接执行第9步
  • 如果返回为 NO:
    1> 先将 self.selectedButtons中的所有按钮selected状态设置为 NO, enabled 也设置为 NO
    2> 在把线条颜色设置为红色
    3> 执行重绘
    4> 0.5秒钟之后, 在执行第9步。
  1. 细节处理
  • 透明问题
    1> 如果是完全通过代码创建 UIView, 在绘图的时候, 如果指定了控件的透明(opaque = NO)opaque 表示不透明, 那么在绘图时会有问题。
    2> 如果希望是透明, 那么要把颜色指定为 clearColor, 而不是 opaque = NO

Demo : https://github.com/Joeyechang/gestureUnlock.git

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • -- iOS事件全面解析 概览 iPhone的成功很大一部分得益于它多点触摸的强大功能,乔布斯让人们认识到手机其实...
    翘楚iOS9阅读 2,998评论 0 13
  • 前言:看了几篇简书,九宫格密码解锁,看着不错,拿来学习一下。 一、实现效果 二、手势解锁实现过程 分析: 如图所示...
    麦穗0615阅读 7,380评论 14 62
  • 1,Search Bar 怎样去掉背景的颜色(storyboard里只能设置background颜色,可是发现cl...
    以德扶人阅读 2,431评论 2 50
  • 我的高效准备时间是120天,每天从早上7点到晚上10点,最后一个月延长到晚上11点,完全不间断,中间唯一的休闲娱乐...
    3组30彭唯婧阅读 240评论 0 0
  • 在简书注册的时间不长。 看了许多人的文章。越看,自己就越是自卑。感觉自己文字的表达力是那麽的弱。以至于有了一丝的恐...
    临川人阅读 2,045评论 101 37