UIGestureRecognizers – UIPanGestureRecognizer – UIPinchGestureRecognizer
Updated post here
UIGestureRecognizers – UIPanGestureRecognizer – UIPinchGestureRecognizer – Part 2
Alright, straight into codes, let’s look at one solid example of implementation.
Example goes,
panGesture = [[[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(panGestureMoveAround:)] autorelease]; [panGesture setMaximumNumberOfTouches:2]; [panGesture setDelegate:self]; [dragView addGestureRecognizer:panGesture]; -(void)panGestureMoveAround:(UIPanGestureRecognizer *)gesture; { UIView *piece = [gesture view]; [self adjustAnchorPointForGestureRecognizer:gesture]; if ([gesture state] == UIGestureRecognizerStateBegan || [gesture state] == UIGestureRecognizerStateChanged) { CGPoint translation = [gesture translationInView:[piece superview]]; [piece setCenter:CGPointMake([piece center].x + translation.x, [piece center].y+translation.y*0.1)]; [gesture setTranslation:CGPointZero inView:[piece superview]]; } } |
This simple example, illustrates how do we continuously set the position of an object when it’s being panned around.
A short read into iOS Human Interface Guideline here, you might realise something like a zoom button, a left/right button, or any interface that act as most as intermediary between end-user and the application is not encouraged in iOS app.
So, what can the cocoa framework do to help us in this matter? Apple engineer has made it relatively easy for developers to include pinching, panning ability to their apps.
In fact, the most appealing selling point of iOS interface, it’s the ability to manipulate photo in Photo Album apps when iOS was first launched back in the 2007.
By getting rid of the intermediaries, your iOS app provides better overall immersive user experience. As such, your app’s interface is cleaner and easier to use. Though you might also have to consider the paradigm that you use, as not all users have the same experience as you are.
//Last post, I forgot to add in the protocol that the class has to conform to which is UIGestureRecognizerDelegate //So your header file will have something like this @interface MyView : UIView //At the header file, just need to write these few lines of code UIPanGestureRecognizer * panGesture; UIPinchGestureRecognizer *pinchGesture; @property(nonatomic, retain) UIPanGestureRecognizer * panGesture; @property(nonatomic, retain) UIPinchGestureRecognizer *pinchGesture; //At your implementation file, these few lines of code should get your GestureRecognizer going panGesture = [[[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(panGestureMoveAround:)] autorelease]; [panGesture setMaximumNumberOfTouches:2]; [panGesture setDelegate:self]; //The pinch gesture pinchGesture = [[UIPinchGestureRecognizer alloc] initWithTarget:self action:@selector(scalePiece:)]; [pinchGesture setDelegate:self]; [piece addGestureRecognizer:pinchGesture]; //Down here, we have the UIView that we want to pan around with. Here is a little tips, when you are working with UIImage and want to pan or pinch them around. You may want to add them to a UIView before doing so. Because I was having very peculiar behavior adding gesture recognizer to UIImage directly. [dragView addGestureRecognizer:panGesture]; -(void)panGestureMoveAround:(UIPanGestureRecognizer *)gesture; { UIView *piece = [gesture view]; //We pass in the gesture to a method that will help us align our touches so that the pan and pinch will seems to originate between the fingers instead of other points or center point of the UIView [self adjustAnchorPointForGestureRecognizer:gesture]; if ([gesture state] == UIGestureRecognizerStateBegan || [gesture state] == UIGestureRecognizerStateChanged) { CGPoint translation = [gesture translationInView:[piece superview]]; [piece setCenter:CGPointMake([piece center].x + translation.x, [piece center].y+translation.y*0.1)]; [gesture setTranslation:CGPointZero inView:[piece superview]]; }else if([gestureRecognizer state] == UIGestureRecognizerStateEnded) { //Put the code that you may want to execute when the UIView became larger than certain value or just to reset them back to their original transform scale } } - (void)pinchGestureMoveAround:(UIPinchGestureRecognizer *)gestureRecognizer { [self adjustAnchorPointForGestureRecognizer:gestureRecognizer]; if ([gestureRecognizer state] == UIGestureRecognizerStateBegan || [gestureRecognizer state] == UIGestureRecognizerStateChanged) { [gestureRecognizer view].transform = CGAffineTransformScale([[gestureRecognizer view] transform], [gestureRecognizer scale], [gestureRecognizer scale]); [gestureRecognizer setScale:1]; }else if([gestureRecognizer state] == UIGestureRecognizerStateEnded) { //The reset works much different here, where applying transform to CGAffineTransformIdentity doesn't work well. You may need to rescale UIView back using setRect function. } } - (void)adjustAnchorPointForGestureRecognizer:(UIGestureRecognizer *)gestureRecognizer { if (gestureRecognizer.state == UIGestureRecognizerStateBegan) { UIView *piece = gestureRecognizer.view; CGPoint locationInView = [gestureRecognizer locationInView:piece]; CGPoint locationInSuperview = [gestureRecognizer locationInView:piece.superview]; piece.layer.anchorPoint = CGPointMake(locationInView.x / piece.bounds.size.width, locationInView.y / piece.bounds.size.height); piece.center = locationInSuperview; } } |
Freelancer for hire!
I am traditionally a Front-end developer. Flash AS3, HTML CSS JavaScript and iOS.
If you have a project that will interest the kid in me. Give me a call. 016-4142334.
About Me
Shoguniphicus Ng Soo How
iPhone Developer / Flash Developer
I am resourceful and keen on taking on new technologies as challenges. My career path morphed slowly from graphic design though 3D motion graphics and now programming with actionscript & objective-c. Bringing more value to the table is the utmost priority of my career goal. I believe in continuos progress and rapid upkeep with latest technology is the key to thrive. "It's less of the function, more of the concept." Getting my hands down and dirty with Objective-C - iPhone







