Limit maximum scale for scaling image with pinch gesture in IOS

Question

I am currently able to make an image scale by using the pinch gesture recognizer provided by Apple, but how can I limit the maximum scale for the image?

I have been using the SimpleGestureRecognizers sample from Apple, which sets the scale to 1, and makes it very easy to scale image, but when I remove it, it jumps suddenly, which is not nice. But then it is hard to track the scale since its alway set to 1.

Thank you in advance.

Answer 1

UIKit will call your selector method many times for a single user gesture (pinch.) Each call will represent a small increment (or decrease) in the scale. If you handle each call to the method and scale your image correspondingly for each small increment, you will get a smooth animation.

You use the recognizer's scale property to modify your image. Then, you reset the property to 1.0 so that the next time the selector method is called, the scale property represents only the new small increment since the last one. You again re-scale your image by the new small increment and reset to 1.0. If you do not reset the recognizer's scale and use it to re-scale your image, you will be scaling your image by the cumulative change, resulting in jumpy behavior (and incorrect scaling.)

So, do make sure to be resetting the gesture recognizer's scale to 1. To keep track of the total change in scale, you can create an instance variable, possibly also called 'scale', for your UIImageView or your ViewController. (In fact, if you used that new scale variable in drawRect to draw your image, you will only have to add a call to setNeedsDisplay in the setter. And you won't have to write any code to redraw the image when the scale changes.)

In any case, the following code (incorporating Ravin's limit check, but on the new scale variable) should work for your selector method:

- (void)pinch:(UIPinchGestureRecognizer *)recognizer
{
    if (recognizer.state == UIGestureRecognizerStateChanged ||
        recognizer.state == UIGestureRecognizerStateEnded) {
        if (imageView.scale < yourScaleLimit) {
            imageView.scale *= recognizer.scale;
            //any other code to scale up the image if
            //just changing imageView.Scale is not enough
        }
        recognizer.scale = 1.0;
    }
}

I hope this is helpful.

Answer 2

If you're only doing this in one place and you don't want to sub-class UIView or UIImageView you can create some local variables to achieve the same result.

Swift

// Variables to keep track of the scale
var imageViewScale: CGFloat = 1.0
let maxScale: CGFloat = 4.0
let minScale: CGFloat = 0.5

@objc func handlePinchGesture(recognizer: UIPinchGestureRecognizer) {

    if recognizer.state == .began || recognizer.state == .changed {
        let pinchScale: CGFloat = recognizer.scale

        if imageViewScale * pinchScale < maxScale && imageViewScale * pinchScale > minScale {
            imageViewScale *= pinchScale
            imageView.transform = (imageView.transform.scaledBy(x: pinchScale, y: pinchScale))
        }
        recognizer.scale = 1.0
    }
}

Apple Documentation Handling Pinch Gestures