How To Add Multiple Gesture Recognizers To UIView?

Hello friends, today we will talk about one of the most important features of iOS app development i.e Gesture Recognizers. How to add multiple gesture recognizers to UIview?

There are Seven Types of Gestures That Support iOS

• Tap Gesture Recognizer: Performing an action on tapping the UIObject.
• Pinch Gesture Recognizer: Used when need the zoom in and zoom out feature
• Rotation Gesture Recognizer: To perform the rotation on UIObject
• Swipe Gesture Recognizer: Four kinds of swipe gestures i.e. Top, left. Bottom, right
• Pan Gesture Recognizer: Help when we need to drag the UIObject on anywhere on UIWindow
• Screen Edge Pan Gesture Recognizer: Special gesture used for 3-D touch
• Long Press: Generally used in the scenario when pressing the UIObject will pop up certain options

Here is a simple declaration of the UIViewController with a single UIImageView in it

class GesturePlayingController: UIViewController {

    let myImageView: UIImageView = {

        $0.contentMode = .scaleAspectFill

        $0.image = UIImage(named: "testImage")

        $0.isUserInteractionEnabled = true
 
       return $0

    }(UIImageView())      

    override func viewDidLoad() {

        super.viewDidLoad()
    }

We have declared the simple UIImageView with lazy initialization with its user interaction property enabled so that we can add multiple gestures to it.

Since no rocket science has been used so far, now we can add the gesture recognizer one by one to imageView. 

func addGesture() {

        let pan = UIPanGestureRecognizer(target: self, action: #selector(panImage))

        let rotate = UIRotationGestureRecognizer(target: self, action: #selector(handleRotation))        

        let pinch = UIPinchGestureRecognizer(target: self, action: #selector(pinchImage))

        myImageView.addGestureRecognizer(pinch)

        myImageView.addGestureRecognizer(pan)

        myImageView.addGestureRecognizer(rotate)

    }

@objc func panImage(_ recognizer: UIPanGestureRecognizer) {    

}
 
@objc func pinchImage(_ recognizer: UIPinchGestureRecognizer) { 

}

@objc func handleRotation(recognizer:UIRotationGestureRecognizer){

}

While adding the gesture recognizer to UIImageView, we need to give the selector that generally functions when the particular types of gestures are being performed.

Let us start with a simple PAN Gesture Recognizer

For moving the imageView in UIView, we need to set the translation from its initial position.

For example 

  @objc func panImage(_ recognizer: UIPanGestureRecognizer) {

        let translation = recognizer.translation(in: view)

        guard let view = recognizer.view else { return }

        view.center = CGPoint(x: view.center.x + translation.x, y: view.center.y + translation.y)

        recognizer.setTranslation(CGPoint.zero, in: view)
    }

After setting the translation, reset the translation to zero so that the next time when you perform the PAN on the imageView, it should start with zero.

Similarly, we can perform the PINCH and ROTATION Gesture on imageView.

@objc func pinchImage(_ recognizer: UIPinchGestureRecognizer) {

        guard let view = recognizer.view else{return}

        view.transform = view.transform.scaledBy(x: recognizer.scale, y: recognizer.scale)

        recognizer.scale = 1.0

    }

    @objc func handleRotation(recognizer:UIRotationGestureRecognizer){

        guard let view = recognizer.view else {return}

        view.transform = view.transform.rotated(by: recognizer.rotation)

        if recognizer.rotation == 0 { return }

        radian = recognizer.rotation

        recognizer.rotation = 0

    }

So far, so good. We’re just applying all the gestures onto the image with the help of which we can move, scale, and rotate the imageView. At last, the question is cleared that how to add multiple gesture recognizers to UIview? Also if you are having any query feel free to contact us.

Vijay Singh Raghav

This blog has been written by Vijay Singh Raghav, a senior iOS developer at MobileCoderz Technologies. His hardcore passion for technology & innovation keeps inspiring him to create such a thought-provoking content for tech lovers.