IOS學習之 手勢操作

IOS學習之 手勢操作
1. UIGestureRecognizer介紹UIGestureRecognizer類是個抽象類別，下面的子類是具體的手勢，開發這可以直接使用這些手勢識別。    UITapGestureRecognizer                // 點擊    UIPinchGestureRecognizer            // 二指往內或往撥出動，平時經常用到的縮放    UIRotationGestureRecognizer       // 旋轉    UISwipeGestureRecognizer           // 滑動，快速移動    UIPanGestureRecognizer               // 拖移，慢速移動    UILongPressGestureRecognizer   // 長按 2、使用手勢的步驟使用手勢很簡單，分為兩步：(1)建立手勢執行個體。當建立手勢時，指定一個回調方法，當手勢開始，改變、或結束時，回調方法被調用。(2)添加到需要識別的View中。每個手勢只對應一個View，當螢幕觸摸在View的邊界內時，如果手勢和預定的一樣，那就會回調方法。ps：一個手勢只能對應一個View，但是一個View可以有多個手勢。 3、Pan 拖動手勢： 

// 建立一個ImageView，然後添加手勢UIImageView *snakeImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"snake.png"]];  snakeImageView.frame = CGRectMake(50, 50, 100, 160);  UIPanGestureRecognizer *panGestureRecognizer = [[UIPanGestureRecognizer alloc]                                                  initWithTarget:self                                                  action:@selector(handlePan:)];      [snakeImageView addGestureRecognizer:panGestureRecognizer];  [self.view setBackgroundColor:[UIColor whiteColor]];  [self.view addSubview:snakeImageView];// 回調方法：- (void) handlePan:(UIPanGestureRecognizer*) recognizer  {      CGPoint translation = [recognizer translationInView:self.view];      recognizer.view.center = CGPointMake(recognizer.view.center.x + translation.x,                                     recognizer.view.center.y + translation.y);      [recognizer setTranslation:CGPointZero inView:self.view];  }

 

  4、Pinch縮放手勢 

UIPinchGestureRecognizer *pinchGestureRecognizer = [[UIPinchGestureRecognizer alloc]                                                          initWithTarget:self                                                          action:@selector(handlePinch:)];                                                         - (void) handlePinch:(UIPinchGestureRecognizer*) recognizer  {      recognizer.view.transform = CGAffineTransformScale(recognizer.view.transform, recognizer.scale, recognizer.scale);      recognizer.scale = 1;  }

 

 5、Rotation旋轉手勢 

UIRotationGestureRecognizer *rotateRecognizer = [[UIRotationGestureRecognizer alloc]                                                   initWithTarget:self                                                   action:@selector(handleRotate:)];  [snakeImageView addGestureRecognizer:rotateRecognizer];- (void) handleRotate:(UIRotationGestureRecognizer*) recognizer  {      recognizer.view.transform = CGAffineTransformRotate(recognizer.view.transform, recognizer.rotation);      recognizer.rotation = 0;  }

 

  6、添加第二個ImagView並添加手勢記住：一個手勢只能添加到一個View，兩個View當然要有兩個手勢的執行個體了 

- (void)viewDidLoad  {      [super viewDidLoad];        UIImageView *snakeImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"snake.png"]];      UIImageView *dragonImageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"dragon.png"]];      snakeImageView.frame = CGRectMake(120, 120, 100, 160);      dragonImageView.frame = CGRectMake(50, 50, 100, 160);      [self.view addSubview:snakeImageView];      [self.view addSubview:dragonImageView];        for (UIView *view in self.view.subviews) {          UIPanGestureRecognizer *panGestureRecognizer = [[UIPanGestureRecognizer alloc]                                                          initWithTarget:self                                                          action:@selector(handlePan:)];            UIPinchGestureRecognizer *pinchGestureRecognizer = [[UIPinchGestureRecognizer alloc]                                                              initWithTarget:self                                                              action:@selector(handlePinch:)];            UIRotationGestureRecognizer *rotateRecognizer = [[UIRotationGestureRecognizer alloc]                                                           initWithTarget:self                                                           action:@selector(handleRotate:)];            [view addGestureRecognizer:panGestureRecognizer];          [view addGestureRecognizer:pinchGestureRecognizer];          [view addGestureRecognizer:rotateRecognizer];          [view setUserInteractionEnabled:YES];      }      [self.view setBackgroundColor:[UIColor whiteColor]];       }

 

  7、拖動(pan手勢)速度(以較快的速度拖放後view有滑行的效果)如何?呢？    1.監視手勢是否結束    2.監視觸摸的速度 

- (void) handlePan:(UIPanGestureRecognizer*) recognizer  {      CGPoint translation = [recognizer translationInView:self.view];      recognizer.view.center = CGPointMake(recognizer.view.center.x + translation.x,                                         recognizer.view.center.y + translation.y);      [recognizer setTranslation:CGPointZero inView:self.view];        if (recognizer.state == UIGestureRecognizerStateEnded) {            CGPoint velocity = [recognizer velocityInView:self.view];          CGFloat magnitude = sqrtf((velocity.x * velocity.x) + (velocity.y * velocity.y));          CGFloat slideMult = magnitude / 200;          NSLog(@"magnitude: %f, slideMult: %f", magnitude, slideMult);            float slideFactor = 0.1 * slideMult; // Increase for more of a slide          CGPoint finalPoint = CGPointMake(recognizer.view.center.x + (velocity.x * slideFactor),                                           recognizer.view.center.y + (velocity.y * slideFactor));          finalPoint.x = MIN(MAX(finalPoint.x, 0), self.view.bounds.size.width);          finalPoint.y = MIN(MAX(finalPoint.y, 0), self.view.bounds.size.height);            [UIView animateWithDuration:slideFactor*2 delay:0 options:UIViewAnimationOptionCurveEaseOut animations:^{              recognizer.view.center = finalPoint;          } completion:nil];      }

 

 代碼實現解析：    1.計算速度向量的長度（估計大部分都忘了）這些知識了。    2.如果速度向量小於200，那就會得到一個小於的小數，那麼滑行會很短    3.基於速度和速度因素計算一個終點    4.確保終點不會跑出父View的邊界    5.使用UIView動畫使view滑動到終點運行後，快速拖動映像view放開會看到view還會在原來的方向滑行一段路。 8、同時觸發兩個view的手勢手勢之間是互斥的，如果你想同時觸發蛇和龍的view，那麼需要實現協議UIGestureRecognizerDelegate，並在協議這個方法裡返回YES。 

-(BOOL)gestureRecognizer:(UIGestureRecognizer *)gestureRecognizer shouldRecognizeSimultaneouslyWithGestureRecognizer:(UIGestureRecognizer *)otherGestureRecognizer {      return YES;  }

 

 把self作為代理設定給手勢： 

panGestureRecognizer.delegate = self;  pinchGestureRecognizer.delegate = self;  rotateRecognizer.delegate = self;

 

 這樣可以同時拖動或旋轉縮放兩個view了。19、tap點選手勢這裡為了方便看到tap的效果，當點擊一下螢幕時，播放一個聲音。為了播放聲音，我們加入AVFoundation.framework這個架構。 

- (AVAudioPlayer *)loadWav:(NSString *)filename {      NSURL * url = [[NSBundle mainBundle] URLForResource:filename withExtension:@"wav"];      NSError * error;      AVAudioPlayer * player = [[AVAudioPlayer alloc] initWithContentsOfURL:url error:&error];      if (!player) {          NSLog(@"Error loading %@: %@", url, error.localizedDescription);      } else {          [player prepareToPlay];      }      return player;  }

 

 我會在最後例子代碼給出完整代碼，添加手勢的步驟和前面一樣的。 

#import <UIKit/UIKit.h>  #import <AVFoundation/AVFoundation.h>  @interface ViewController : UIViewController<UIGestureRecognizerDelegate>  @property (strong) AVAudioPlayer * chompPlayer;  @property (strong) AVAudioPlayer * hehePlayer;  @end  - (void)handleTap:(UITapGestureRecognizer *)recognizer {      [self.chompPlayer play];  }

 

 運行，點一下某個圖，就會播放一個咬東西的聲音。不過這個點擊播放聲音有點缺陷，就是在慢慢拖動的時候也會播放。這使得兩個手勢重合了。怎麼解決呢？使用手勢的：requireGestureRecognizerToFail方法。 10、手勢的依賴性在viewDidLoad的迴圈裡添加這段代碼：1[tapRecognizer requireGestureRecognizerToFail:panGestureRecognizer];意思就是，當如果pan手勢失敗，就是沒發生拖動，才會出發tap手勢。這樣如果你有輕微的拖動，那就是pan手勢發生了。tap的聲音就不會發出來了。 11、自訂手勢自訂手勢繼承：UIGestureRecognizer，實現下面的方法： 

– touchesBegan:withEvent:  – touchesMoved:withEvent:  – touchesEnded:withEvent:  - touchesCancelled:withEvent:

 

 建立一個類，繼承UIGestureRecognizer，代碼如下：.h檔案 

#import <UIKit/UIKit.h>  typedef enum {      DirectionUnknown = 0,      DirectionLeft,      DirectionRight  } Direction;    @interface HappyGestureRecognizer : UIGestureRecognizer  @property (assign) int tickleCount;  @property (assign) CGPoint curTickleStart;  @property (assign) Direction lastDirection;    @end

 

 .m檔案 

#import "HappyGestureRecognizer.h"  #import <UIKit/UIGestureRecognizerSubclass.h>  #define REQUIRED_TICKLES        2  #define MOVE_AMT_PER_TICKLE     25    @implementation HappyGestureRecognizer    - (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {      UITouch * touch = [touches anyObject];      self.curTickleStart = [touch locationInView:self.view];  }    - (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {    // Make sure we've moved a minimum amount since curTickleStart      UITouch * touch = [touches anyObject];      CGPoint ticklePoint = [touch locationInView:self.view];      CGFloat moveAmt = ticklePoint.x - self.curTickleStart.x;      Direction curDirection;      if (moveAmt < 0) {          curDirection = DirectionLeft;      } else {          curDirection = DirectionRight;      }      if (ABS(moveAmt) < MOVE_AMT_PER_TICKLE) return;        // 確認方向改變了      if (self.lastDirection == DirectionUnknown ||          (self.lastDirection == DirectionLeft && curDirection == DirectionRight) ||          (self.lastDirection == DirectionRight && curDirection == DirectionLeft)) {            // 撓癢次數          self.tickleCount++;          self.curTickleStart = ticklePoint;          self.lastDirection = curDirection;            // 一旦撓癢次數超過指定數，設定手勢為結束狀態          // 這樣回呼函數會被調用。          if (self.state == UIGestureRecognizerStatePossible && self.tickleCount > REQUIRED_TICKLES) {              [self setState:UIGestureRecognizerStateEnded];          }      }    }    - (void)reset {      self.tickleCount = 0;      self.curTickleStart = CGPointZero;      self.lastDirection = DirectionUnknown;      if (self.state == UIGestureRecognizerStatePossible) {          [self setState:UIGestureRecognizerStateFailed];      }  }    - (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event  {      [self reset];  }    - (void)touchesCancelled:(NSSet *)touches withEvent:(UIEvent *)event  {      [self reset];  }    @end

 

 調用自訂手勢和上面一樣，回到這樣寫： 

- (void)handleHappy:(HappyGestureRecognizer *)recognizer{      [self.hehePlayer play];  }

 

 手勢成功後播放呵呵笑的聲音。在真機上運行，按住某個view，快速左右拖動，就會發出笑的聲音了。代碼解析：先擷取起始座標：curTickleStart通過和ticklePoint的x值對比，得出當前的放下是向左還是向右。再算出移動的x的值是否比MOVE_AMT_PER_TICKLE距離大，如果太則返回。再判斷是否有三次是不同方向的動作，如果是則手勢結束，回調。