手势密码锁

一、 手势解锁应用 分析 

1.监听手指在view上的移动，首先肯定需要自定义一个view，重写touch began,touch move等方法，当手指移动到圈上时，让其变亮。可以通过button按钮来实现。

2.界面搭建

背景图片（给控制器的view添加一个imageview，设置属性背景图片）

九个按钮（把九个按钮作为一个整体，使用一个大的view来管理这些小的view,这些小的view就是9个button。如果使用手动拖控件的方式实现页面搭建，那么9个按钮需要拖拽九次，且需要对齐，不灵活，这里选择使用以【九宫格】代码的方式创建9个按钮）。

3.新建一个类，对自定义的view进行管理，这个view是从storyboard创建出来的，会调用aweakframe方法和initwithcoder方法，后者先调用因此把创建按钮的代码写在这个方法中。

部分代码：

 1 //界面搭建 
 2 - (id)initWithFrame:(CGRect)frame 
 3 { 
 4     self = [super initWithFrame:frame];
 5     if (self) { 
 6         [self setup]; 
 7     } 
 8     return self; 
 9 }
 10 
 11 -(id)initWithCoder:(NSCoder *)aDecoder
 12 {
 13     if (self=[super initWithCoder:aDecoder]) {
 14         [self setup];
 15     }
 16     return self;
 17 }
 18 //在界面上创建9个按钮
 19 -(void)setup
 20 {
 21     //1.创建9个按钮
 22     for (int i=0; i<9; i++) {
 23         UIButton *btn=[UIButton buttonWithType:UIButtonTypeCustom];
 24         //2.设置按钮的状态背景
 25         [btn setBackgroundImage:[UIImage imageNamed:@"gesture_node_normal"] forState:UIControlStateNormal];
 26         [btn setBackgroundImage:[UIImage imageNamed:@"gesture_node_highlighted"] forState:UIControlStateSelected];
 27         //3.把按钮添加到视图中
 28         [self  addSubview:btn];
 29         //4.禁止按钮的点击事件
 30         btn.userInteractionEnabled=NO;
 31     }
 32 }

注意点： 在initwithcoder：方法中一定要先对父类进行初始化。 

说明： 当视图从xib或storyboard中创建出来会调用initwithcoder：方法，如果视图是通过代码创建出来的，那么就会调用initwithFrame：方法。 

提示： 使用代码创建视图，即便是调用init方法而不是直接调用nitwithFrame：方法，init方法内部也会调用nitwithFrame：方法。 

建议： 如果重写view的话，建议同时重写这两个方法。调用，【self setup】 

三、实现基本连线

步骤：

1.创建按钮

2.设置按钮的背景图片（默认状态——选中状态）

3.添加按钮到view

提示： 不要在构造方法中设置按钮的frame,因为这个方法是在构造方法中调用的，而在构造方法中获取不了frame。 

4.在layoutSubviews中设置按钮的frame。（提示：一定要先调用父类的layoutSubviews）

4.1取出对应位置的按钮

4.2设置每个按钮的frame

5.监听手指的移动。分析程序，应该监听手指的移动，而不是按钮的点击，当手指移动到按钮的范围内时，让按钮变亮。

5.1重写touchesbegan...方法

(1)获取按下的点

(2)判断触摸的位置是否在按钮的范围内（使用超级for循环）

提示： 一个判断点是否在指定范围内的方法——CGRectContainsPoint(,)； 

5.2重新touchesmoved...方法

说明： 当手指移动到按钮上的时候，按钮变亮，因此需要重写touchesmoved方法。 

（1）获取触摸的点

（2）判断触摸的点是否在按钮的范围内。

提示： 可以把上面两个功能分别进行封装，在使用的时候直接调用即可。 

封装代码：

 1 //对功能点进行封装 
 2 -(CGPoint)getCurrentPoint:(NSSet *)touches 
 3 { 
 4     UITouch *touch=[touches anyObject]; 
 5     CGPoint point=[touch locationInView:touch.view]; 
 6     return point; 
 7 } 
 8  
 9 -(UIButton *)getCurrentBtnWithPoint:(CGPoint)point
 10 {
 11     for (UIButton *btn in self.subviews) {
 12         if (CGRectContainsPoint(btn.frame, point)) {
 13             return btn;
 14         }
 15     }
 16     return Nil;
 17 }

整理：

（1）获取按下的点

（2）获取触摸的按钮

（3）（存储按钮）设置触摸按钮的状态

（4）通知view绘制线段

四、绘制线段

思路： 获取为选中状态的按钮，并把它们存到一个数组中，重写drawRect方法，从数组中取出所有的按钮，连接所有按钮的中点。 

注意： 数组中不能存空值，在存储之前需要先进行判断。 

新的问题：已经被连过的按钮，不能再连线。（在存储按钮的时候判断，如果该按钮已经被连线，那么就不再添加到数组中）。

解决代码：

1   if (btn && btn.selected != YES) {
2         //设置按钮的选中状态
3         btn.selected=YES;
4         //把按钮添加到数组中
5         [self.buttons addObject:btn];
6     }

绘制线段

（1）获取上下文

（2）取出按钮（起点和终点）

（3）渲染

代码：

 1 //重写drawrect:方法 
 2 -(void)drawRect:(CGRect)rect 
 3 { 
 4     //获取上下文 
 5     CGContextRef ctx=UIGraphicsGetCurrentContext(); 
 6     //绘图（线段） 
 7     for (int i=0; i<self.buttons.count; i++) { 
 8         UIButton *btn=self.buttons[i]; 
 9         if (0==i) {
 10             //设置起点（注意连接的是中点）
 11 //            CGContextMoveToPoint(ctx, btn.frame.origin.x, btn.frame.origin.y);
 12             CGContextMoveToPoint(ctx, btn.center.x, btn.center.y);
 13         }else
 14         {
 15 //            CGContextAddLineToPoint(ctx, btn.frame.origin.x, btn.frame.origin.y);
 16             CGContextAddLineToPoint(ctx, btn.center.x, btn.center.y);
 17         }
 18     }
 19     //渲染
 20     //设置线条的属性
 21     CGContextSetLineWidth(ctx, 10);
 22     CGContextSetRGBStrokeColor(ctx, 20/255.0, 107/255.0, 153/255.0, 1);
 23     CGContextStrokePath(ctx);
 24 }