80-手势解锁

// LockView.m

// 手势解锁

// 界面搭建结构:

// 在View上放一个imageView，放置背景图片

// 在背景图片imageView上在放一个imageView，用来放置按钮,即LockView

#import "LockView.h"

@interface LockView ()

//记录当前移动的点

@property (nonatomic,assign) CGPoint curP;

//保存所有选中的按钮

@property (nonatomic,strong) NSMutableArray *selectBtns;

//显示最终的密码

@property (nonatomic,weak) UILabel *labelShowPwd;

@end

@implementation LockView

//懒加载数组

-(NSMutableArray *)selectBtns

{

if (_selectBtns==nil)
{

_selectBtns=[NSMutableArray array];

}

return _selectBtns;

}

#pragma mark 1.添加所有子控件

//awakeFromNib 加载完xib或storyboard就会调用

-(void)awakeFromNib

{

//创建lable显示密码

UILabel *labelShowPwd=[[UILabel alloc] init];

//字体居中

labelShowPwd.textAlignment=NSTextAlignmentCenter;

labelShowPwd.textColor=[UIColor greenColor];

CGRect rect= self.superview.bounds;

labelShowPwd.frame=CGRectMake(rect.origin.x, 80,
rect.size.width, 50);

//添加到当前imageView的父容器:BGView

[self.superview addSubview:labelShowPwd];

_labelShowPwd=labelShowPwd;

//创建九宫格，添加9个按钮

for (int i=0;
i<9; i++) {

UIButton *btn=[UIButton buttonWithType:UIButtonTypeCustom];

//给按钮添加普通和高亮时的背景图片

[btn setBackgroundImage:[UIImage imageNamed:@"gesture_node_normal"] forState:UIControlStateNormal];

[btn setBackgroundImage:[UIImage imageNamed:@"gesture_node_highlighted"] forState:UIControlStateSelected];

//设置按钮不允许与用户交互,目的是把按钮点击事件交给当前View处理

btn.userInteractionEnabled=NO;

//绑定按钮的tab目的

//1>是记录选中按钮与之前的是否一致

//2>拼接所有选中按钮的tag拼成串(密码串)

btn.tag=i;

[self addSubview:btn];

}

}

/*

注意:

1>按钮的高亮状态是系统自动达到的，用户长按就可以达到

2>按钮的选中状态系统无法自动达到，必须通过手写代码达到(如下:one,two)

one:给按钮注册事件

[btn addTarget:self action:@selector(btnClick:) forControlEvents:UIControlEventTouchUpInside];

two:监听按钮点击,目的是让点击的按钮成选中状态

-(void)btnClick:(UIButton *)btn

{

//让按钮达到选中状态

btn.selected=YES;

}

*/

#pragma mark 2.设置子控件的位置(frame)

//layoutSubviews 在父容器发生改变时就会调用

-(void)layoutSubviews

{

[super layoutSubviews];

//计算9个按钮的位置,布局九宫格

//按钮的总数就是当前View的所有子控件

int count=(int)self.subviews.count;

CGFloat btnWH=74;

CGFloat btnX=0;

CGFloat btnY=0;

int totaCols=3;

int col=0;

int row=0;

//间距

CGFloat margn=(self.bounds.size.width -totaCols
*btnWH)/(totaCols+1);

for (int i=0;
i<count; i++) {

UIButton *btn=self.subviews[i];

col=i %totaCols;

row=i /totaCols;

btnX=margn +col *(margn +btnWH);

btnY =row *(margn +btnWH);

btn.frame=CGRectMake(btnX,
btnY, btnWH, btnWH);

}

}

#pragma mark 3.手指移动的时候记录选中的按钮

-(void)touchesMoved:(NSSet *)touches
withEvent:(UIEvent *)event

{

//每一次重新画线前要清空原来label的内容

_labelShowPwd.text=@"";

//得到touch对象

UITouch *touch=[touches anyObject];

//获取当前触摸点

CGPoint curP=[touch locationInView:self];

//记录当前移动的点

_curP=curP;

//遍历所有按钮，判断当前点在哪个按钮上

for (UIButton *btn in self.subviews)
{

//判断当前点(curP)是否在某一范围(btn.frame)

if (CGRectContainsPoint(btn.frame,
curP)) {

//判断是为了每一个按钮只能选中一次

if (btn.selected==NO)
{

//选中的按钮

btn.selected=YES;

//将选中按钮放入数组中记录

[self.selectBtns addObject:btn];

}

}

}

//重绘(为连线)

[self setNeedsDisplay];

}

#pragma mark 5.把选中的按钮画线

//只要调用drawRect,就会清空之前的按钮

-(void)drawRect:(CGRect)rect

{

//没有选中按钮就不需要画线

if (self.selectBtns.count==0)
{

return ;

}

//画线

UIBezierPath *path=[UIBezierPath bezierPath];

//遍历所有选中按钮 画线

int count=(int)self.selectBtns.count;

for (int i=0;
i<count; i++) {

UIButton *selectBtn=self.selectBtns[i];

//线的起点是第一个选中按钮中心

if (i==0)
{

//设置起点

[path moveToPoint:selectBtn.center];

}

else{

//添加线到选中按钮的中心

[path addLineToPoint:selectBtn.center];

}

}

//添加一根线在手指移动的位置(手指最初触摸点)

[path addLineToPoint:_curP];

//画线

//设置线段样式(线宽，连接圆角,颜色)

[path setLineWidth:5];

[path setLineJoinStyle:kCGLineJoinRound];

[[UIColor greenColor]set];

[path stroke];

}

#pragma mark 手指抬起时，获取选中的密码，取消所有选中的按钮，把线清空

//手指抬起时发生

-(void)touchesEnded:(NSSet *)touches
withEvent:(UIEvent *)event

{

NSMutableString *pwdstr=[NSMutableString string];

//遍历所有选中的按钮，把按钮的tab拼成串儿

for (UIButton *selBtn in self.selectBtns)
{

[pwdstr appendFormat:@"%ld",selBtn.tag];

}

//给显示密码的lable赋值

_labelShowPwd.text=pwdstr;

//所有按钮取消选中 setSelected:系统方法

[self.selectBtns makeObjectsPerformSelector:@selector(setSelected:) withObject:@NO];

//在数组中清空所有选中的按钮

[self.selectBtns removeAllObjects];

//重绘

[self setNeedsDisplay];

}

@end