最近一直没有更新是因为在开发和测试阶段,有任务,没有进行学习,不过在做任务的时候也遇到了一些技术点,在这里总结一下。
今天看了一个视频,是关于手机屏幕手势锁的(以下简称“手势锁”)。手机屏幕手势锁的应用很广泛,尤其在支付app和OA类的app中用到的比较多,今天我们就按照视频上的思路进行一下学习和整理总结。
整体来说该方法在实现手势锁的过程中,使用到的知识点可以归纳为以下:button九宫格、touch触摸事件、UIBezierPath贝塞尔曲线、代理等等。其实我们把这几个知识点拆开来看都不是很难,我们在平时也没有少用。那么我们就开始!
这里说明一下,我这里没有完整的代码块,即便有,也只是部分的截图,大家可以看每张截图的左边代码的行数,就知道大概的位置了,另外我会在文章最后贴上两个链接,一个链接是老师的视频链接,另一个链接是一个代码块的代码,具体代码的实现和我的这篇文章的代码会有些出入,但是实现原理是一样。
首先传一个gif动画,看一下我们最后实现的效果:
然后贴上素材,我就是因为找素材找了半天,但是最后找到的素材还不是教程上边的,凑合着用吧,总之是有点影响效果,但是不影响咱们学习知识的过程。
下边分别是高亮状态和normal状态的素材。和教材的区别就是人家的图片是圆的,我这里的是截图,方形的。
我们来看一下我们xcode中的组织结构:
这里我大概说一下实现思路:首先自定一个LockView,然后在controller里面调用该view,AppDelegate跳转controller进行展示。最主要的代码是在自定义的view里面实现的。
首先第一个知识点:视频里的老师还讲到了const的作用:定义的变量是只读的,不能修改。在其他类中不能声明相同名字的变量。
这里我们可以实验一下:
上边我在自定义的LockView.m中对CGFloat变量btnCount进行了const定义,而上图中我又在controller里面对同样名字的CGFloat变量进行定义,结果是什么呢?我们Command+B进行编译,结果报下图的错:
而我们试图将controller里面的名字改成btnCount1,再进行编译的时候是可以通过的。
通过验证,我们对const的认识加深了。
下边我们继续我们手势锁的实现。我们来自定义view里面.m具体的代码实现。
视频里面是用storyboard实现view和controller的,而我们这里是纯代码实现。不管用哪一种,最终的实现效果是一样的。而上边的两个方法,注释里面解释到了上述两种方法分别会在什么情况下被调用。
也就是说,不管是什么情况创建的view,总会调用[selfaddButtons];这个方法。下边我们就来看这个方法。
九宫格的实现,相信大家在实际项目中并没有少写过吧,这里不进行详细介绍了。
这里需要说明的有两点,视频里面讲的方法个别地方有些实现起来不太对的,那么我们可以自己略微的修改。上边绿色的字就是,使用视频里面的方法确实是好,看着也很新颖,也合理,之前也没有用过,可是就是在我们代码里面实现不了,没办法,只好再按照forin循环遍历的方法,将button的状态进行修改了。
下图是对出现过两次的代码的封装方法:
还有就是下边讲到的drawrect方法里面的贝塞尔曲线设置颜色的顺序,我进行了调整,不调整的话,根本赋不上颜色值,幸好我之前看过贝塞尔弧线。侥幸。
至此,自定义view完成,主要是在touch触摸事件里面完成对九宫格状态的修改、在drawrect方法里面对九宫格连线进行了处理。
我们看一下自定义view的.h文件里面的代码,主要是定义了一个代理,自定义view里面实现代理是在touchEnd方法里面,就是触摸结束的时候,然后再controller里面调用设置自定义view的代理self。
controller里面的代码:调用自定义view和设置alert方便观察密码正确与否。
最后是appDelegate里面调用controller的代码:
至此,手势锁就完成了。当然会有如下两种情况我们没有办法模拟:
1、如果输入错误超过n次,会不允许继续输入,并且可能会有锁死的状态。
2、输入密码正确进入app。应该是自定义view销毁或者页面push的过程。
参考:手势锁视频
(女老师,感觉不食人间烟火,一点废话也没有,一点调侃也没有,比较生硬,但是声音还算不难听)
手势锁代码和简单解释
(对代码和实现手势锁的原理进行了简单的介绍,代码和我的代码有些区别,但是实现的结果是一样的)
最后,哪里不对的地方可以给我留言,我会及时改进的,谢谢大家。