SDLockView 基于贝塞尔曲线的手势解锁-白红宇

####从造轮子到SDLockView

手势解锁这个三方在很早之前就存在了,只是以前是没有用到过,这两天中秋在家闲着没事的时候就写了一个关于手势解锁的三方SDLockView.其中SDLockView主要的功能有三种,分别是设置手势密码,修改手势密码,验证手势密码.接下来,我们就一睹为快SDLockView的效果图.

####SDLockView的快速生成

有很多时候,我们需要快速生成SDLockView页面,这时候,对其,我们只需要简简单单的三步,就可以快速集成SDLockView.首先,我们要把Demo中的SDLockView文件夹拖入目标工程中.其中文件夹中包含了SDLockView实现类,UIImage+SizeUpdata(关于修改图片尺寸的延展),和两个图标.

紧接着就是初始化我们的SDLockView对象,我们要选定它的LockViewType类型,LockViewType为一个枚举类型的数据.

typedef enum  {    SetPassWordType,//设置密码类型界面    UpdataPassWordType,//修改密码类型界面    TestingPassWordType,//验证密码类型界面} LockViewType;复制代码

选好类型之后,我们直接可以创建SDLockView页面了.

SDLockView *view = [SDLockView initWithLockViewType:self.lockViewType];复制代码

最后添加到我们的视图上即可.

[self.view addSubview:view];复制代码

####SDLockView属性介绍

为了方便更多人定制属于自己的手势解锁,SDLockView暴露了许多实用的属性接口.属性主要分为基本用法,拓展用法设置,文字信息设置,提示信息设置四大模块.注释已经加的不能再详细了,再有什么问题,可以直接询问骚栋.谢谢.

基本用法

拓展用法设置

文字信息设置

提示信息设置

####SDLockView实现核心详解

SDLockView的实现核心其实就是贝塞尔曲线,但是我们要为绘制做大量的准备工作.首先我们通过touchesBegan、touchesMoved、touchesEnded三个方法把用户的触摸过的所有Button放置在selectedButtons数组中(要考虑到去重问题,使用isExistWithButton这个方法进行实现).代码如下

//touchesMoved中的去重问题//判读是否存在,如果存在,则不存储.if (![self isExistWithButton:button]) {                [self.selectedButtons addObject:button]; }     复制代码

每一次调用touchesMoved方法的时候都让其重新绘制View页面,调用方法如下.

//重新绘制[self setNeedsDisplay];复制代码

绘制过程其实就是调用了- (void)drawRect:(CGRect)rect这个方法,我们只需要方法中绘制贝塞尔曲线以及提示文本信息即可.在绘制的过程中,我们只需要把selectedButtons中每一个Button的中心设置为线段的转折点即可.

- (void)drawRect:(CGRect)rect{        NSMutableParagraphStyle *paragraphStyle = [[NSMutableParagraphStyle alloc] init];        paragraphStyle.alignment = NSTextAlignmentCenter;//（两端对齐的）文本对齐方式：（左，中，右，两端对齐，自然）        [self.promptMessage drawInRect:CGRectMake(0, self.distanceY - 40, KmainWidth, 40) withAttributes:@{                 NSKernAttributeName: @8,                 NSFontAttributeName : [UIFont systemFontOfSize:(self.wordSize?self.wordSize:17)],                 NSForegroundColorAttributeName :(self.wordColor?self.wordColor:[UIColor blackColor]),                 NSParagraphStyleAttributeName:paragraphStyle,                                                                                                       }];                UIBezierPath *path = [UIBezierPath bezierPath];        int i = 0;        for (UIButton *button in self.selectedButtons) {                if (i == 0) {                        [path moveToPoint:button.center];        }else{                            [path addLineToPoint:button.center];                        }                i++;            }    [self.lineColor set];        [path setLineWidth:self.lineWidth];        [path setLineJoinStyle:kCGLineJoinRound];        [path stroke];}复制代码

######SDLockView的相关使用就说这么多了,如果您对SDLockView有任何疑义,欢迎提出,谢谢.最后附上SDLockView的github的传送门.

###[-->SDLockView的传送门?](https://github.com/wang82426107/SDLockView)