gestures n.
Skip this Video
Loading SlideShow in 5 Seconds..
Gestures PowerPoint Presentation


282 Vues Download Presentation
Télécharger la présentation


- - - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript

  1. Gestures UIGestureRecognizer

  2. gestures • There are 6 default gestures recognized by iOS: • Tap gesture (UITapGestureRecognizer) • Pan gesture (UIPanGestureRecognizer) • Pinch gesture (UIPinchGestureRecognizer) • Rotate gesture (UIRotationGestureRecognizer) • Swipe gesture (UISwipeGestureRecognizer) • Long press gesture (UILongPressGestureRecognizer) • You can also make your own gesture recognizers

  3. Process • Create an instance of a gesture recognizer • Attach the instance to a view • Create the gesture handler • Can be done programmatically or via IB • we’ll do it programmatically

  4. Example • Create a new project (can be a single view or a tabbed view) • Put a label on the view and connect an IBOutlet to the label • Add an imageView from the library. Add an image to your project and assign it to the image view. • Add an IBOutlet and connect it to your image • Make sure that User Interaction Enabled is checked in both the identity inspector and the attributes inspector

  5. Tap gesture • Make sure your CMPViewContrller.h file has the IBoutlets and add an integer instance variable: #import <UIKit/UIKit.h> @interface CMPFirstViewController : UIViewController{ intnumTaps; } @property (weak, nonatomic) IBOutletUITextView *textPtr; @property (weak,nonatomic) IBOutletUIImageView *myImage; @end numTaps keeps track of the number of times the image has been touched textPtr will allow us to change the label to count the number of times the image is taped myImage is a link to the image in the storyboard so that we can put a gesture recognizer on it

  6. CMPviewController.m • Create the tap gesture handler: − (void)handleTapGesture1:(UITapGestureRecognizer *)sender { if (sender.state == UIGestureRecognizerStateEnded){ // handling code numTaps++; NSString *tempString = [NSString stringWithFormat:@"Number of taps: %d", numTaps]; self.textPtr.text = tempString; } } numTaps keeps track of the number of times the image has been touched Change the label to include the number of taps

  7. CMPviewController.m • Now we need to put a tap gesture recognizer on the image. We do this in viewDidLoad: − (void)viewDidLoad { [super viewDidLoad]; self.textPtr.text = @"Welcome to the first view!"; // set up to recognize the tap gesture UITapGestureRecognizer *tapImage = [[UITapGestureRecognizeralloc] initWithTarget:self action:@selector(handleTapGesture1:)]; [self.myImageaddGestureRecognizer:tapImage]; } Create an instance of a UITapGestureRecognizer. The @selector means “method” and we have to pass the method that we created in the last slide. That method will be called when the tap is recognized on the image. Attach the gesture recognizer to the image (myImage is an IBOutlet that links to the image in the storyboard).

  8. run • If tapping on the image doesn’t change the label, make sure that you’ve clicked the “User Interaction Enabled” checkbox on the image in the storyboard.

  9. Pan Gestures • This allows you to move a view. • Add to the CMPViewController.h file: @interface CMPFirstViewController : UIViewController{ intnumTaps; // used for the pan gesture CGFloat _firstX; CGFloat_firstY; } @property (weak, nonatomic) IBOutletUITextView *textPtr; @property (weak,nonatomic) IBOutletUIImageView *myImage; @end

  10. Pan Gestures • Add to the handler to the CMPViewController.m file: −(IBAction)handlePanGesture1:(UIPanGestureRecognizer *)sender { CGPointtranslatedPoint = [(UIPanGestureRecognizer*)sender translationInView:_myImage]; if([(UIPanGestureRecognizer*)sender state] == UIGestureRecognizerStateBegan) { _firstX = [_myImage center].x; _firstY = [_myImage center].y; } translatedPoint = CGPointMake(_firstX+translatedPoint.x, _firstY + translatedPoint.y); [self.myImagesetCenter:translatedPoint]; } translatedPoint gives the new position (where the pan gesture has moved to) relative to the starting point This is only done when the pan begins. After that the _firstx and _firsty values are reused. _firstX and _firstY keep track of the original center of the image.

  11. Pan Gesture • Add to the viewDidLoadmethod: // set up to recgnize the pan gesture UIPanGestureRecognizer*imagePanGesture= [[UIPanGestureRecognizeralloc] initWithTarget:self action:@selector(handlePanGesture1:)]; [self.myImageaddGestureRecognizer:imagePanGesture];

  12. Run • You should be able to move the image.

  13. Pinch gesture • Add to the CMPViewController.m file: − (IBAction)handlePinchGesture1:(UIGestureRecognizer *)sender { CGFloatfactor = [(UIPinchGestureRecognizer *)sender scale]; if (factor > 0.5){ self.myImage.transform= CGAffineTransformMakeScale(factor, factor); } } The sender contains the scale represented by the pinch The sender contains the scale represented by the pinch

  14. Pinch Gesture • Add to viewDidLoad method: // set up to recognize the pinches UIPinchGestureRecognizer *pinchGesture = [[UIPinchGestureRecognizeralloc] initWithTarget:self action:@selector(handlePinchGesture1:)]; [self.myImageaddGestureRecognizer:pinchGesture];

  15. run • Should be able to expand/shrink the image