本次讲的手势密码,是在九个按键上实现的,这里讲的是手势密码的基本实现和效果

同样先上效果图

其实就是对画图功能的一个实现,再加上手势操作结合起来

屏幕宽度高度,方便下面操作,不做解释

#define ScreenHeight [[UIScreen mainScreen] bounds].size.height

#define ScreenWidth [[UIScreen mainScreen] bounds].size.width

控制器.m文件

这里的imageView是用来装手势画图之后的image,看后面就清楚了

 @property (nonatomic,strong)NSMutableArray *buttonArr;//全部手势按键的数组
@property (nonatomic,strong)NSMutableArray *selectorArr;//选中手势按键的数组
@property (nonatomic,assign)CGPoint startPoint;//记录开始选中的按键坐标
@property (nonatomic,assign)CGPoint endPoint;//记录结束时的手势坐标
@property (nonatomic,strong)UIImageView *imageView;//画图所需
 -(NSMutableArray *)selectorArr
{
if (!_selectorArr) {
_selectorArr = [[NSMutableArray alloc]init];
}
return _selectorArr;
}

添加九个按键,设置状态图片,实际开发中一般有三种状态,即默认,选中正确和选择错误,错误一般指的是我们要记录下用户的手势密码,需要用户

画出两次相同的手势密码才能保存,若两次输入不一致,就是错误状态的一种,当然还包括其它的,不多说了

这里要强调

 btn.userInteractionEnabled = NO;
这句的重要性,如果不关闭按键的用户交互,下面的UITouch则无法在按键中触发,所以这里必须关闭
 - (void)viewDidLoad {
[super viewDidLoad];
self.view.backgroundColor = [UIColor whiteColor]; if (!_buttonArr) {
_buttonArr = [[NSMutableArray alloc]initWithCapacity:];
} self.imageView = [[UIImageView alloc]initWithFrame:CGRectMake(, , ScreenWidth, ScreenHeight)];
[self.view addSubview:self.imageView]; for (int i=; i<; i++) {
for (int j=; j<; j++) {
UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];
btn.frame = CGRectMake(ScreenWidth/+ScreenWidth/*j, ScreenHeight/+ScreenWidth/*i, ScreenWidth/, ScreenWidth/);
[btn setImage:[UIImage imageNamed:@"pbg"] forState:UIControlStateNormal];
[btn setImage:[UIImage imageNamed:@"pbg01"] forState:UIControlStateHighlighted];
btn.userInteractionEnabled = NO;
[self.buttonArr addObject:btn];
[self.imageView addSubview:btn];
} }
}

这个方法就是实现画图的方法

 -(UIImage *)drawLine{
UIImage *image = nil; UIColor *col = [UIColor colorWithRed: green: blue: alpha:];
UIGraphicsBeginImageContext(self.imageView.frame.size);//设置画图的大小为imageview的大小
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSetLineWidth(context, );
CGContextSetStrokeColorWithColor(context, col.CGColor); CGContextMoveToPoint(context, self.startPoint.x, self.startPoint.y);//设置画线起点 //从起点画线到选中的按键中心,并切换画线的起点
for (UIButton *btn in self.selectorArr) {
CGPoint btnPo = btn.center;
CGContextAddLineToPoint(context, btnPo.x, btnPo.y);
CGContextMoveToPoint(context, btnPo.x, btnPo.y);
}
//画移动中的最后一条线
CGContextAddLineToPoint(context, self.endPoint.x, self.endPoint.y); CGContextStrokePath(context); image = UIGraphicsGetImageFromCurrentImageContext();//画图输出
UIGraphicsEndImageContext();//结束画线
return image;
}

最后部分是手势,每次在屏幕上点击的时候都会调用的方法

 //开始手势
-(void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event
{
UITouch *touch = [touches anyObject];//保存所有触摸事件
if (touch) { for (UIButton *btn in self.buttonArr) { CGPoint po = [touch locationInView:btn];//记录按键坐标 if ([btn pointInside:po withEvent:nil]) {//判断按键坐标是否在手势开始范围内,是则为选中的开始按键 [self.selectorArr addObject:btn];
btn.highlighted = YES;
self.startPoint = btn.center;//保存起始坐标
} } } } //移动中触发,画线过程中会一直调用画线方法
-(void)touchesMoved:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event
{
UITouch *touch = [touches anyObject];
if (touch) { self.endPoint = [touch locationInView:self.imageView];
for (UIButton *btn in self.buttonArr) {
CGPoint po = [touch locationInView:btn];
if ([btn pointInside:po withEvent:nil]) { BOOL isAdd = YES;//记录是否为重复按键
for (UIButton *seBtn in self.selectorArr) {
if (seBtn == btn) {
isAdd = NO;//已经是选中过的按键,不再重复添加
break;
}
}
if (isAdd) {//未添加的选中按键,添加并修改状态
[self.selectorArr addObject:btn];
btn.highlighted = YES;
} }
}
}
self.imageView.image = [self drawLine];//每次移动过程中都要调用这个方法,把画出的图输出显示 }
//手势结束触发
-(void)touchesEnded:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event
{
self.imageView.image = nil;
self.selectorArr = nil;
for (UIButton *btn in self.buttonArr) {
btn.highlighted = NO;
}
}

开发中有时需要在最后时把画出的手势密码图显示保留一秒时,不能直接使用上面的画图image输出多一次,因为输出的连最后一条线都画出来了,如果要实现这个保留效果,

可以在画线方法里添加一个是否画最后一条线的判断,加个bool传参,在画线结束时再调用这个方法和参数,禁止最后一条线画出来就行了,当然不能在画的过程禁止,而是在结束的时候,不然一条线都画不出的,最后把图片展示多次就行了

需要的把btn和密码相关联,方法也有很多种,例如给btn设置tag值,把tag对应作为密码保存和验证就行了

最新文章

  1. &lt;hr&gt;标签不止创建html水平线也可以画圆噢
  2. #8.11.16总结#CSS常用样式总结(二)
  3. application/x-www-form-urlencoded multipart/form-data text/plain 后台返回的数据响应的格式类型
  4. Coursera台大机器学习技法课程笔记02-Dual Support Vector Machine
  5. Ubuntu的一些常用快捷键
  6. fwite写入文件
  7. [Java] SSH框架笔记_Struts2配置问题
  8. Css3小技术
  9. b/s客户端和服务器的交互(转)
  10. SilkTest Q&amp;A 5
  11. POJ 3278 Catch That Cow(BFS,板子题)
  12. Cordova/Ionic Android 开发环境搭建 - Windows系统
  13. HTML 转义字符对应表
  14. 当x,y和theta都是向量的时候如何计算损失
  15. (转)Thread中yield方法
  16. Confluence 6 从一个模板中创建一个空间
  17. Scrapy实战篇(八)之Scrapy对接selenium爬取京东商城商品数据
  18. JVM学习笔记(三):类文件结构
  19. Leetcode题库——14.最长公共前缀
  20. npm publish gives “unscoped packages cannot be private”

热门文章

  1. JS打印页面指定区域
  2. 分享15个HTML5工具
  3. ASP.NET Core开发-使用Nancy框架
  4. 关于ajax的同步和异步
  5. ROW_NUMBER、RANK()、DENSE_RANK()和OVER的使用
  6. 怎样给Eclipse添加一个Xml模板
  7. IOS 集成第三方登录
  8. 代码与图详解性能之Python集合类型(list tuple dict set generator)
  9. Java--Semaphore控制并发线程数量
  10. Could not publish to the server. java.lang.NullPointerException