iOS开发_手势解锁

Posted 2020-08-03

创建一个继承于UIView的子类如下：

头文件ZRLockView.h

 1 ZRLockView.h
 2 
 3 #import <UIKit/UIKit.h>
 4 
 5 @class ZRLockView;
 6 
 7 @protocol ZRLockViewDelegate <NSObject>
 8 
 9 @optional
10 -(void)lockView:(ZRLockView *)lockView didFinishPath:(NSString *)path;
11 
12 @end
13 
14 @interface ZRLockView : UIView
15 
16 @property(nonatomic,weak) IBOutlet id<ZRLockViewDelegate> delegate;
17 
18 @end

 

ZRLockView.m文件

 

  1 ZRLockView.m
  2 
  3 #import "ZRLockView.h"
  4 
  5 @interface ZRLockView ()
  6 
  7 @property(nonatomic,strong) NSMutableArray *selectedButtons;
  8 @property(nonatomic,assign) CGPoint currentMovePoint;
  9 @end
 10 
 11 @implementation ZRLockView
 12 
 13 #pragma mark --初始化
 14 -(NSMutableArray *)selectedButtons{
 15     if (!_selectedButtons) {
 16         _selectedButtons = [NSMutableArray array];
 17     }
 18     return _selectedButtons;
 19 }
 20 
 21 -(id)initWithFrame:(CGRect)frame{
 22     self = [super initWithFrame:frame];
 23     if (self) {
 24         [self setUp];
 25     }
 26     return self;
 27 }
 28 
 29 -(id)initWithCoder:(NSCoder *)aDecoder{
 30     if (self == [super initWithCoder:aDecoder]) {
 31         [self setUp];
 32     }
 33     return self;
 34 }
 35 //初始化
 36 -(void)setUp{
 37     for (int index=0; index<9; index++) {
 38         UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];
 39         btn.userInteractionEnabled = NO;
 40         [btn setBackgroundImage:[UIImage imageNamed:@"gesture_node_normal"] forState:UIControlStateNormal];
 41         [btn setBackgroundImage:[UIImage imageNamed:@"gesture_node_highlighted"] forState:UIControlStateSelected];
 42         btn.tag = index;
 43         [self addSubview:btn];
 44     }
 45 }
 46 
 47 -(void)layoutSubviews{
 48 
 49     [super layoutSubviews];
 50     for (int index=0; index<self.subviews.count; index++) {
 51         //取出按钮
 52         UIButton *btn = self.subviews[index];
 53         // 设置frame
 54         CGFloat btnW = 74;
 55         CGFloat btnH = 74;
 56         int totalColumns = 3;
 57         int col = index % totalColumns;
 58         int row = index / totalColumns;
 59         CGFloat marginX = (self.frame.size.width -totalColumns * btnW)/(totalColumns + 1);
 60         CGFloat marginY = marginX;
 61 
 62         CGFloat btnX = marginX + col * (btnW + marginX);
 63         CGFloat btnY = marginY + row *(btnH + marginY);
 64         btn.frame = CGRectMake(btnX, btnY, btnW, btnH);
 65     }
 66 }
 67 
 68 #pragma mark --私有方法，根据touches集合获得对应的触摸点位置
 69 -(CGPoint)pointWithTouches:(NSSet *)touches{
 70     UITouch *touch = [touches anyObject];
 71     return [touch locationInView:touch.view];
 72 }
 73 //根据触摸点获得对应的按钮
 74 -(UIButton *)buttonWithPoint:(CGPoint)point{
 75     for (UIButton *btn in self.subviews) {
 76         CGFloat wh = 30;
 77         CGFloat btnX = btn.center.x - wh * 0.5;
 78         CGFloat btnY = btn.center.y - wh * 0.5;
 79         if (CGRectContainsPoint(CGRectMake(btnX, btnY, wh, wh), point)) {
 80             return btn;
 81         }
 82     }
 83     return nil;
 84 }
 85 #pragma mark --触摸方法
 86 -(void)touchesBegan:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{
 87     //清空当前点
 88     self.currentMovePoint = CGPointMake(-10, -10);
 89     //获得触摸点
 90     CGPoint pos = [self pointWithTouches:touches];
 91     // 获得触摸按钮
 92     UIButton *btn = [self buttonWithPoint:pos];
 93     //3 设置状态
 94     if (btn && [self.selectedButtons containsObject:btn] == NO) {
 95         btn.selected = YES;
 96         [self.selectedButtons addObject:btn];
 97     }
 98     //4 刷新
 99     [self setNeedsDisplay];
100 }
101 
102 -(void)touchesMoved:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{
103     //获得触摸点
104     CGPoint pos = [self pointWithTouches:touches];
105     // 获得触摸按钮
106     UIButton *btn = [self buttonWithPoint:pos];
107     if (btn && btn.selected ==NO) {//摸到按钮
108         btn.selected = YES;
109         [self.selectedButtons addObject:btn];
110     }else{//没有摸到按钮
111         self.currentMovePoint = pos;
112     }
113     //4 刷新
114     [self setNeedsDisplay];
115 }
116 
117 -(void)touchesEnded:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{
118     //代理通知
119     if ([self.delegate respondsToSelector:@selector(lockView:didFinishPath:)]) {
120         NSMutableString *path = [NSMutableString string];
121         for (UIButton *btn in self.selectedButtons) {
122             [path appendFormat:@"%d",btn.tag];
123         }
124         [self.delegate lockView:self didFinishPath:path];
125     }
126 
127 //    NSLog(@"%@",str);
128     //取消所选中的按钮
129 //    for (UIButton *btn in self.selectedButtons) {
130 //        btn.selected = NO;
131 //    }
132     [self.selectedButtons makeObjectsPerformSelector:@selector(setSelected:) withObject:@(NO)];
133     //清空选中的按钮
134     [self.selectedButtons removeAllObjects];
135     [self setNeedsDisplay];
136 
137     self.currentMovePoint = CGPointZero;
138 }
139 
140 -(void)touchesCancelled:(NSSet<UITouch *> *)touches withEvent:(UIEvent *)event{
141     [self touchesEnded:touches withEvent:event];
142 }
143 
144 -(void)drawRect:(CGRect)rect{
145     //
146     if (self.selectedButtons.count == 0) return;
147 
148     UIBezierPath *path = [UIBezierPath bezierPath];
149     //便利所有的按钮
150     for (int index = 0; index < self.selectedButtons.count; index++) {
151         UIButton *btn = self.selectedButtons[index];
152         if (index == 0) {
153             [path moveToPoint:btn.center];
154         }else{
155             [path addLineToPoint:btn.center];
156         }
157     }
158     //链接
159     if (CGPointEqualToPoint(self.currentMovePoint, CGPointMake(-10, -10)) == NO) {
160         [path addLineToPoint:self.currentMovePoint];
161     }
162     //绘图
163     path.lineWidth = 8;
164     path.lineJoinStyle = kCGLineJoinBevel;
165 //    [[UIColor greenColor] set];
166     [[UIColor colorWithRed:32/255.0 green:210/255.0 blue:254/255.0 alpha:0.7] set];
167     [path stroke];
168 }
169 
170 @end

 

将我写好的类文件直接拖到Xcode已有的项目中，想在哪个类中实现这个功能，导入头文件，运行你就懂了

 1 #import "ViewController.h"
 2 #import "ZRLockView.h"
 3 
 4 @interface ViewController ()<ZRLockViewDelegate>
 5 
 6 @end
 7 
 8 @implementation ViewController
 9 
10 - (void)viewDidLoad {
11     [super viewDidLoad];
12     // Do any additional setup after loading the view, typically from a nib.
13 }
14 
15 - (void)lockView:(ZRLockView *)lockView didFinishPath:(NSString *)path{
16     NSLog(@"获得用户的手势路径：%@",path);
17 }
18 
19 @end