iOS手势识别的详细使用.doc

iOS手势识别的详细使用(拖动,缩放,旋转,点击,手势依赖,自定义手势)1、UIGestureRecognizer介绍手势识别在iOS上非常重要，手势操作移动设备的重要特征，极大的增加了移动设备使用便捷性。iOS系统在3.2以后，为方便开发这使用一些常用的手势，提供了UIGestureRecognizer类。手势识别UIGestureRecognizer类是个抽象类，下面的子类是具体的手势，开发这可以直接使用这些手势识别。 UITapGestureRecognizer UIPinchGestureRecognizer UIRotationGestureRecognizer UISwipeGestureRecognizer UIPanGestureRecognizer UILongPressGestureRecognizer上面的手势对应的操作是： Tap（点一下） Pinch（二指往內或往外拨动，平时经常用到的缩放） Rotation（旋转） Swipe（滑动，快速移动） Pan （拖移，慢速移动） LongPress（长按）UIGestureRecognizer的继承关系如下：2、使用手势的步骤使用手势很简单，分为两步：1. 创建手势实例。当创建手势时，指定一个回调方法，当手势开始，改变、或结束时，回调方法被调用。2. 添加到需要识别的View中。每个手势只对应一个View，当屏幕触摸在View的边界内时，如果手势和预定的一样，那就会回调方法。ps：一个手势只能对应一个View，但是一个View可以有多个手势。建议在真机上运行这些手势,模拟器操作不太方便，可能导致你认为手势失效。3、Pan 拖动手势：cppview plaincopy1. UIImageView*snakeImageView=UIImageViewallocinitWithImage:UIImageimageNamed:snake.png;2. snakeImageView.frame=CGRectMake(50,50,100,160);3. UIPanGestureRecognizer*panGestureRecognizer=UIPanGestureRecognizeralloc4. initWithTarget:self5. action:selector(handlePan:);6. snakeImageViewaddGestureRecognizer:panGestureRecognizer;7. self.viewsetBackgroundColor:UIColorwhiteColor;8. self.viewaddSubview:snakeImageView;新建一个ImageView，然后添加手势回调方法：cppview plaincopy1. -(void)handlePan:(UIPanGestureRecognizer*)recognizer2. 3. CGPointtranslation=recognizertranslationInView:self.view;4. recognizer.view.center=CGPointMake(recognizer.view.center.x+translation.x,5. recognizer.view.center.y+translation.y);6. recognizersetTranslation:CGPointZeroinView:self.view;7. 8. 4、Pinch缩放手势cppview plaincopy1. UIPinchGestureRecognizer*pinchGestureRecognizer=UIPinchGestureRecognizeralloc2. initWithTarget:self3. action:selector(handlePinch:);snakeImageViewaddGestureRecognizer:pinchGestureRecognizer;cppview plaincopy1. -(void)handlePinch:(UIPinchGestureRecognizer*)recognizer2. 3. recognizer.view.transform=CGAffineTransformScale(recognizer.view.transform,recognizer.scale,recognizer.scale);4. recognizer.scale=1;5. 5、Rotation旋转手势cppview plaincopy1. UIRotationGestureRecognizer*rotateRecognizer=UIRotationGestureRecognizeralloc2. initWithTarget:self3. action:selector(handleRotate:);4. snakeImageViewaddGestureRecognizer:rotateRecognizer;cppview plaincopy1. -(void)handleRotate:(UIRotationGestureRecognizer*)recognizer2. 3. recognizer.view.transform=CGAffineTransformRotate(recognizer.view.transform,recognizer.rotation);4. recognizer.rotation=0;5. 添加了这几个手势后，运行看效果，程序中的imageView放了一个 / _|_| O| / / _/ _|_/ _ | | / / / / / / / / / / _-_ / / _- -_ | | ( ( _- _-_ -_ _/ | -_- _- -_ -_- / -_ _- -_ _- -_- -_-的图片，在模拟器上拖动是没问题的。缩放和旋转有点问题，估计是因为在模拟器上的模拟的两个接触点距离在imageView的边界外了，所以操作无效果。建议在真机上运行这个手势。在模拟器上缩放和选择的操作技巧：可以把imageView的frame值设置大一点，按住alt键，按下触摸板(不按下不行)，这样就可以旋转和缩放了。6、添加第二个ImagView并添加手势记住：一个手势只能添加到一个View，两个View当然要有两个手势的实例了cppview plaincopy1. -(void)viewDidLoad2. 3. superviewDidLoad;4. 5. UIImageView*snakeImageView=UIImageViewallocinitWithImage:UIImageimageNamed:snake.png;6. UIImageView*dragonImageView=UIImageViewallocinitWithImage:UIImageimageNamed:dragon.png;7. snakeImageView.frame=CGRectMake(120,120,100,160);8. dragonImageView.frame=CGRectMake(50,50,100,160);9. self.viewaddSubview:snakeImageView;10. self.viewaddSubview:dragonImageView;11. 12. for(UIView*viewinself.view.subviews)13. UIPanGestureRecognizer*panGestureRecognizer=UIPanGestureRecognizeralloc14. initWithTarget:self15. action:selector(handlePan:);16. 17. UIPinchGestureRecognizer*pinchGestureRecognizer=UIPinchGestureRecognizeralloc18. initWithTarget:self19. action:selector(handlePinch:);20. 21. UIRotationGestureRecognizer*rotateRecognizer=UIRotationGestureRecognizeralloc22. initWithTarget:self23. action:selector(handleRotate:);24. 25. viewaddGestureRecognizer:panGestureRecognizer;26. viewaddGestureRecognizer:pinchGestureRecognizer;27. viewaddGestureRecognizer:rotateRecognizer;28. viewsetUserInteractionEnabled:YES;29. 30. self.viewsetBackgroundColor:UIColorwhiteColor;31. 多添加了一条龙的view，两个view都能接收上面的三种手势。运行效果如下：7、拖动(pan手势)速度(以较快的速度拖放后view有滑行的效果)如何实现呢？1. 监视手势是否结束2. 监视触摸的速度cppview plaincopy1. -(void)handlePan:(UIPanGestureRecognizer*)recognizer2. 3. CGPointtranslation=recognizertranslationInView:self.view;4. recognizer.view.center=CGPointMake(recognizer.view.center.x+translation.x,5. recognizer.view.center.y+translation.y);6. recognizersetTranslation:CGPointZeroinView:self.view;7. 8. if(recognizer.state=UIGestureRecognizerStateEnded)9. 10. CGPointvelocity=recognizervelocityInView:self.view;11. CGFloatmagnitude=sqrtf(velocity.x*velocity.x)+(velocity.y*velocity.y);12. CGFloatslideMult=magnitude/200;13. NSLog(magnitude:%f,slideMult:%f,magnitude,slideMult);14. 15. floatslideFactor=0.1*slideMult;/Increaseformoreofaslide16. CGPointfinalPoint=CGPointMake(recognizer.view.center.x+(velocity.x*slideFactor),17. recognizer.view.center.y+(velocity.y*slideFactor);18. finalPoint.x=MIN(MAX(finalPoint.x,0),self.view.bounds.size.width);19. finalPoint.y=MIN(MAX(finalPoint.y,0),self.view.bounds.size.height);20. 21. UIViewanimateWithDuration:slideFactor*2delay:0options:UIViewAnimationOptionCurveEaseOutanimations:22. recognizer.view.center=finalPoint;23. completion:nil;24. 25. 26. 代码实现解析：1. 计算速度向量的长度（估计大部分都忘了）这些知识了。2. 如果速度向量小于200，那就会得到一个小于的小数，那么滑行会很短3. 基于速度和速度因素计算一个终点4. 确保终点不会跑出父View的边界5. 使用UIView动画使view滑动到终点运行后，快速拖动图像view放开会看到view还会在原来的方向滑行一段路。8、同时触发两个view的手势手势之间是互斥的，如果你想同时触发蛇和龙的view，那么需要实现协议UIGestureRecognizerDelegate，cppview plaincopy1. interfaceViewController:UIViewController2. end并在协议这个方法里返回YES。cppview plaincopy1. -(BOOL)gestureRecognizer:(UIGestureRecognizer*)gestureRecognizershouldRecognizeSimultaneouslyWithGestureRecognizer:(UIGestureRecognizer*)otherGestureRecognizer2. 3. returnYES;4. 把self作为代理设置给手势：cppview plaincopy1. panGestureRecognizer.delegate=self;2. pinchGestureRecognizer.delegate=self;3. rotateRecognizer.delegate=self;这样可以同时拖动或旋转缩放两个view了。9、tap点击手势这里为了方便看到tap的效果，当点击一下屏幕时，播放一个声音。为了播放声音，我们加入AVFoundation.framework这个框架。cppview plaincopy1. -(AVAudioPlayer*)loadWav:(NSString*)filename2. NSURL*url=NSBundlemainBundleURLForResource:filenamewithExtension:wav;3. NSError*error;4. AVAudioPlayer*player=AVAudioPlayerallocinitWithContentsOfURL:urlerror:&error;5. if(!player)6. NSLog(Errorloading%:%,url,error.localizedDescription);7. else8. playerprepareToPlay;9. 10. returnplayer;11. 我会在最后例子代码给出完整代码，添加手势的步骤和前面一样的。cppview plaincopy1. #import2. #import3. 4. interfaceViewController:UIViewController5. property(strong)AVAudioPlayer*chompPlayer;6. property(strong)AVAudioPlayer*hehePlayer;7. 8. endcppview plaincopy1. -(void)handleTap:(UITapGestureRecognizer*)recognizer2. self.chompPlayerplay;3. 运行，点一下某个图，就会播放一个咬东西的声音。不过这个点击播放声音有点缺陷，就是在慢慢拖动的时候也会播放。这使得两个手势重合了。怎么解决呢？使用手势的：requireGestureRecognizerToFail方法。10、手势的依赖性在viewDidLoad的循环里添加这段代码：cppview plaincopy1. tapRecognizerrequireGestureRecognizerToFail:panGestureRecognizer;意思就是，当如果pan手势失败，就是没发生拖动，才会出发tap手势。这样如果你有轻微的拖动，那就是pan手势发生了。tap的声音就不会发出来了。11、自定义手势自定义手势继承：UIGestureRecognizer，实现下面的方法：cppview plaincopy1. touchesBegan:withEvent:2. touchesMoved:withEvent:3. touchesEnded:withEvent:4. -touchesCancelled:withEvent:新建一个类，继承UIGestureRecognizer，代码如下：.h文件cppview plaincopy1. #import2. typedefenum3. DirectionUnknown=0,4. DirectionLeft,5. DirectionRight6. Direction;7. 8. interfaceHappyGestureRecognizer:UIGestureRecognizer9. property(assign)inttickleCount;10. property(assign)CGPointcurTickleStart;11. property(assign)DirectionlastDirection;12. 13. end.m文件cppview plaincopy1. #importHappyGestureRecognizer.h2. #import3. #defineREQUIRED_TICKLES24. #defineMOVE_AMT_PER_TICKLE255. 6. implementationHappyGestureRecognizer7. 8. -(void)touchesBegan:(NSSet*)toucheswithEvent:(UIEvent*)event9. UITouch*touch=touchesanyObject;10. self.curTickleStart=touchlocationInView:self.view;11. 12. 13. -(void)touchesMoved:(NSSet*)toucheswithEvent:(UIEvent*)event14. 15. /MakesurewevemovedaminimumamountsincecurTickleStart16. UITouch*touch=touchesanyObject;17. CGPointticklePoint=touchlocationInView:self.view;18. CGFloatmoveAmt=ticklePoint.x-self.curTickleStart.x;19. DirectioncurDirection;20. if(moveAmt0)21. curDirec