IOS手勢解鎖

標籤：ios

手勢解鎖，這個小東西以前看著挺高大上的，但是實際上內容不是特別難，瞭解了就不深奧了，思路理一下

1、控制器中放一個imageView放背景圖片，拖一個View放到螢幕中間用來放9個按鈕；

2、自訂view類和控制器中的view綁定，所有內容均在自訂view中寫；

3、封裝一個方法，添加9個按鈕，並且設定普通和選擇狀態的圖片以及按鈕的tag值，方便最後取路徑，並且讓按鈕不能與使用者互動，因為要整體把控手指的位置，不能用按鈕的點擊事件；

4、在解析xib時調用的方法 -(id)initWithCoder:(NSCoder *)sDecoder中或者在載入xib完成時調用的方法- (void)awakeFromNib中調用添加按鈕的方法都可以；

5、設定按鈕的位置，需要在- (void)layoutSubviews這個方法中設定，要用到九宮格演算法；

6、設定完成之後按鈕就可以顯示了，接下來要處理手勢，首先在手指點下的時候判斷當前點是不是在按鈕上面，如果在按鈕上面要添加到事先準備好的按鈕數組中，並且按鈕的狀態要是沒被選中過的；

7、接下來是手指移動的時候，跟手指開始點的時候一樣，但是要在最後調用setNeedsDisplay方法，不過要給準備好的當前位置賦值，進行重繪

8、最後是手指抬起來的時候，拼接按鈕的tag值形成路徑，調用按鈕的setSeleed方法讓按鈕不被選中，清空按鈕數組中得所有值並且重繪

9、最最重要的時繪圖方法 ：要先把按鈕數組中的按鈕串連起來，然後串連事先準備好的當前位置，設定自己喜歡的連線樣式，最後渲染就可以了。

代碼：

////  CFLockView.m//  手勢解鎖////  Created by chenfei on 15/6/19.//  Copyright (c) 2015年 chenfei. All rights reserved.//#import "CFLockView.h"@interface CFLockView ()@property (nonatomic, strong) NSMutableArray *btns;@property (nonatomic, assign) CGPoint moveP;@end@implementation CFLockView//懶載入-(NSMutableArray *)btns{    if (_btns == nil) {        _btns = [NSMutableArray array];    }    return _btns;}// 載入xib完成的時候調用- (void)awakeFromNib{    }- (void)drawRect:(CGRect)rect {    if (!self.btns.count) return;    UIBezierPath *path = [UIBezierPath bezierPath];//    把第一個作為起點    for (int i = 0; i < self.btns.count; i++) {        UIButton *btn = self.btns[i];        if (i == 0) {            [path moveToPoint:btn.center];        }else{            [path addLineToPoint:btn.center];        }    }    //    串連當前手指的位置    [path addLineToPoint:self.moveP];    [[UIColor greenColor] set];    path.lineWidth = 8;    path.lineJoinStyle = kCGLineCapRound;//    渲染    [path stroke];}//解析xib時調用- (id)initWithCoder:(NSCoder *)aDecoder{    if (self = [super initWithCoder:aDecoder]) {        [self addBtns];    }        return self;}- (void)addBtns{    for (int i = 0; i < 9; i++) {        UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];        button.tag = i + 1;        [button setImage:[UIImage imageNamed:@"gesture_node_normal"] forState:UIControlStateNormal];                [button setImage:[UIImage imageNamed:@"gesture_node_highlighted"] forState:UIControlStateSelected];                button.userInteractionEnabled = NO;                [self addSubview:button];    }}// 設定按鈕frame-(void)layoutSubviews{    [super layoutSubviews];        CGFloat col = 0;    CGFloat row = 0;        CGFloat btnW = 74;    CGFloat btnH = 74;    CGFloat btnX = 0;    CGFloat btnY = 0;        CGFloat totCol = 3;    CGFloat margin = (self.bounds.size.width - totCol * btnW) / (totCol + 1);        for (int i = 0; i < self.subviews.count; i++) {        UIButton *button = self.subviews[i];        col = i % 3;        row = i / 3;        btnX = margin + (margin + btnW) * col;        btnY = margin + (margin + btnH) * row;        button.frame = CGRectMake(btnX, btnY, btnW, btnH);    }}- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event{    UITouch *touch = [touches anyObject];    CGPoint pos = [touch locationInView:self];        for (UIButton *btn in self.subviews) {        if (CGRectContainsPoint(btn.frame, pos) && btn.selected == NO) {            btn.selected = YES;            [self.btns addObject:btn];        }    }}- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event{    UITouch *touch = [touches anyObject];    CGPoint pos = [touch locationInView:self];    self.moveP = pos;    //    修改小bug，讓手指移動到按鈕偏中心點才畫,//    只有移動到按鈕中間的30 * 30的位置才畫 註：按鈕是74 * 74    CGFloat wh = 30;        for (UIButton *btn in self.subviews) {        CGFloat x = btn.center.x - wh * 0.5;        CGFloat y = btn.center.y - wh * 0.5;        CGRect frame = CGRectMake(x, y, wh, wh);                if (CGRectContainsPoint(frame, pos) && btn.selected == NO) {            btn.selected = YES;            [self.btns addObject:btn];        }    }        [self setNeedsDisplay];}-(void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event{    NSMutableString  *str = [NSMutableString string];    for (UIButton *button in self.btns) {        [str appendFormat:@"%d",button.tag];    }        NSLog(@"%@", str);    [self.btns makeObjectsPerformSelector:@selector(setSelected:) withObject:NO];    [self.btns removeAllObjects];    [self setNeedsDisplay];}@end

IOS手勢解鎖