IOS七种手势详解（动图＋Demo下载）

原创Blog，转载请注明出处 
blog.csdn.net/hello_hwc 
欢迎关注我的博客专栏，这个关于IOS SDK的专栏我会持续更新 
IOS SDK详解

前言： 
触摸是交互的核心，而手势是触摸的上层封装，易于使用，不易出错。本文介绍了7种常用手势，多数手势我都配合Core Animation举了一个例子。给读者一些参考。最后，Demo的链接我会放到最后。

Demo源代码下载 

CSDN下载 
GitHub下载

一 UIGestureRecognizer

UIGestureRecognizer是一个抽象类，定义了手势所需的一些基本的属性和方法。当然，也可以自定义自己的手势，近期不会更新相关文章，所以不在本文的考虑范畴。七种子类是常用的也是IOS SDK提供的类。

UITapGestureRecognizer

UIPinchGestureRecognizer

UIRotationGestureRecognizer

UISwipeGestureRecognizer

UIPanGestureRecognizer

UIScreenEdgePanGestureRecognizer

UILongPressGestureRecognizer
1
2
3
4
5
6
7
8
9
10
11
12
13

一些常用的方法

位置信息

获得触摸的位置
- (CGPoint)locationInView:(UIView *)view
1
2
3

获得某一个触摸的位置- (CGPoint)locationOfTouch:(NSUInteger)touchIndex                    inView:(UIView *)view
1
2
3

当前手势有几个触摸- (NSUInteger)numberOfTouches
1
2

State

这个很重要，因为要通过State来判断手势的情况

@property(nonatomic, readwrite) UIGestureRecognizerState state
1
2
3
4

绑定手势的view@property(nonatomic, readonly) UIView *view
1
2

取消或者延迟

@property(nonatomic) BOOL cancelsTouchesInView
@property(nonatomic) BOOL delaysTouchesBegan
@property(nonatomic) BOOL delaysTouchesEnded
1
2
3

两个手势之间关系

- (void)requireGestureRecognizerToFail:(UIGestureRecognizer *)otherGestureRecognizer
1

二 UITapGestureRecognizer

Demo的效果图－tap一下，图片抖动 
];
self.imageview.center = self.view.center;
[self.view addSubview:self.imageview];
[self.imageview setUserInteractionEnabled:YES];
//绑定手势
UIPinchGestureRecognizer * pinch = [[UIPinchGestureRecognizer alloc] initWithTarget:self action:@selector(pinch:)];
[self.imageview addGestureRecognizer:pinch];
self.isLargeView = NO;
self.oldFrame = self.imageview.frame;
}

-(void)pinch:(UIPinchGestureRecognizer *)pinch{
if (pinch.state == UIGestureRecognizerStateRecognized) {
if (!self.isLargeView && pinch.velocity > 0) {
self.backgroundView = [[UIView alloc] initWithFrame:self.view.frame];
self.backgroundView.backgroundColor = [UIColor blackColor];
self.backgroundView.alpha = 0.0;
self.imageview.backgroundColor = [UIColor blueColor];
[self.view insertSubview:self.backgroundView belowSubview:self.imageview];
[UIView animateWithDuration:0.8
delay:0.0
options:UIViewAnimationOptionCurveEaseInOut
animations:^{
self.backgroundView.alpha = 1.0;
if ([[UIDevice currentDevice].model isEqualToString:@"ipad"]) {
self.imageview.frame = CGRectMake(0,300,768,512);
}else
{
self.imageview.frame = CGRectMake(0,220,320,210);
}
}
completion:^(BOOL finished) {
self.isLargeView = YES;

}];
}
if (self.isLargeView && pinch.velocity <0) {
[UIView animateWithDuration:0.8
animations:^{
self.backgroundView.alpha = 0.0;
self.imageview.frame = self.oldFrame;

}
completion:^(BOOL finished) {
[self.backgroundView removeFromSuperview];
self.backgroundView = nil;
self.isLargeView = NO;
}];
}
}
}

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16
• 17
• 18
• 19
• 20
• 21
• 22
• 23
• 24
• 25
• 26
• 27
• 28
• 29
• 30
• 31
• 32
• 33
• 34
• 35
• 36
• 37
• 38
• 39
• 40
• 41
• 42
• 43
• 44
• 45
• 46
• 47
• 48
• 49
• 50
• 51
• 52
• 53
• 54
• 55
• 56
• 57
• 58
• 59
• 60
• 61
• 62

属性和方法介绍 
@property(nonatomic) CGFloat scale //scale的绝对值（相对最初的距离） 
@property(nonatomic, readonly) CGFloat velocity //速度

四 UIRotationGestureRecognizer

效果如图－旋转 
];
self.imageview.center = self.view.center;
[self.view addSubview:self.imageview];
UIPanGestureRecognizer * pan = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(pan:)];
self.imageview.userInteractionEnabled = YES;
[self.imageview addGestureRecognizer:pan];
self.initalCenter = self.imageview.center;
}
-(void)pan:(UIPanGestureRecognizer *)sender{
if (sender.state == UIGestureRecognizerStateBegan) {

}else if(sender.state == UIGestureRecognizerStateChanged){
CGPoint translation = [sender translationInView:self.view];
self.imageview.center = CGPointMake(self.initalCenter.x + translation.x,self.initalCenter.y + translation.y);
}else{
[UIView animateWithDuration:0.5
delay:0.0
options:UIViewAnimationOptionCurveEaseInOut animations:^{
self.imageview.center = self.initalCenter;
} completion:^(BOOL finished) {

}];
}
}

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12
• 13
• 14
• 15
• 16
• 17
• 18
• 19
• 20
• 21
• 22
• 23
• 24
• 25
• 26
• 27
• 28
• 29
• 30
• 31
• 32
• 33
• 34

属性方法介绍@property(nonatomic) NSUInteger maximumNumberOfTouches //手势所需的最大手指数@property(nonatomic) NSUInteger minimumNumberOfTouches //手势所需的最小手指数- (CGPoint)translationInView:(UIView *)view //在view中移动的距离- (CGPoint)velocityInView:(UIView *)view //移动速度
1
2
3
4
5
6
7
8
9

七 UIScreenEdgePanGestureRecognizer

效果如图－实现简单的侧拉效果 
 
实现代码

-(void)viewDidLoad{
    UIScreenEdgePanGestureRecognizer * edge = [[UIScreenEdgePanGestureRecognizer alloc] initWithTarget:self action:@selector(edgePan:)];
    edge.edges = UIRectEdgeRight;
    [self.view addGestureRecognizer:edge];
}
-(void)edgePan:(UIScreenEdgePanGestureRecognizer *)sender{
    if (sender.state == UIGestureRecognizerStateBegan) {
        self.edgeView = [[UIView alloc] initWithFrame:CGRectOffset(self.view.frame,CGRectGetWidth(self.view.frame),0)];
        self.edgeView.backgroundColor = [UIColor blueColor];
        self.offsetCenter = self.edgeView.center;
        [self.view addSubview:self.edgeView];
    }else if(sender.state == UIGestureRecognizerStateChanged){
        CGPoint translation = [sender translationInView:self.view];
        self.edgeView.center = CGPointMake(self.offsetCenter.x + translation.x,self.offsetCenter.y);
    }else if(sender.state == UIGestureRecognizerStateEnded)
    {
        if ([sender velocityInView:self.view].x <0) {
            [UIView animateWithDuration:0.3 animations:^{
                self.edgeView.center = self.view.center;
            }];
        }else{
            [UIView animateWithDuration:0.3
                                  delay:0.0
                                options:UIViewAnimationOptionBeginFromCurrentState
                             animations:^{
                                 self.edgeView.center = self.offsetCenter;
                             }
                             completion:^(BOOL finished) {
                                 [self.edgeView removeFromSuperview];
                                 self.edgeView = nil;
                             }];
        }
    }else{
        [UIView animateWithDuration:0.3
                              delay:0.0
                            options:UIViewAnimationOptionBeginFromCurrentState
                         animations:^{
                             self.edgeView.center = self.offsetCenter;
                         }
                         completion:^(BOOL finished) {
                             [self.edgeView removeFromSuperview];
                             self.edgeView = nil;
                         }];
    }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45

属性和方法介绍@property(readwrite, nonatomic, assign) UIRectEdge edges //哪些边缘添加edgePan
1
2

八 UILongPressGestureRecognizer

效果如图－长按删除图片 

实现代码

-(void)viewDidLoad{
    self.imageview.userInteractionEnabled = YES;
    UILongPressGestureRecognizer * lOngpress= [[UILongPressGestureRecognizer alloc] initWithTarget:self action:@selector(longpress:)];
    longpress.minimumPressDuration = 0.5;
    longpress.numberOfTapsRequired = 0;
    longpress.cancelsTouchesInView = YES;
    longpress.delegate = self;
    [self.imageview addGestureRecognizer:longpress];
}
-(void)longpress:(UILongPressGestureRecognizer *)sender{
    if (sender.state == UIGestureRecognizerStateBegan){
        UIAlertView * alertview = [[UIAlertView alloc] initWithTitle:@"Warning"
                                                             message:@"Delete this image?"
                                                            delegate:self
                                                   cancelButtonTitle:@"Cancel"
                                                   otherButtonTitles:@"OK", nil];
        [alertview show];
        [sender cancelsTouchesInView];
    }
}
-(void)alertView:(UIAlertView *)alertView clickedButtonAtIndex:(NSInteger)buttonIndex{
    if (buttOnIndex== 1) {
        [UIView animateWithDuration:1.0
                              delay:0.0
                            options:0
                         animations:^{
                             self.imageview.alpha = 0.0;
                         } completion:^(BOOL finished) {
                             [self.imageview removeFromSuperview];
                         }];
    }
    self.imageview.userInteractionEnabled = YES;
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33

属性和方法介绍@property(nonatomic) CFTimeInterval minimumPressDuration //手势识别的最小按压时间@property(nonatomic) NSUInteger numberOfTouchesRequired //几根手指@property(nonatomic) NSUInteger numberOfTapsRequired //识别手势需要的预先点击数目，通常为0@property(nonatomic) CGFloat allowableMovement //允许移动的距离
1
2
3
4
5
6
7
8
9