UITapGestureRecognizer 탭 제스처 인식기

[iOS, Swift] UITapGestureRecognizer 탭 제스처 인식기

https://cocoacasts.com/swift-fundamentals-working-with-tap-gesture-recognizers-in-swift

UITapGestureRecognizer 클래스를 이용해 탭 제스처를 사용하는 법.

import UIKit

class ViewController: UIViewController {

    // MARK: - Properties

    @IBOutlet private var tappableView: UIView! {
        didSet {
            tappableView.backgroundColor = .red
        }
    }

    // MARK: - View Life Cycle

    override func viewDidLoad() {
        super.viewDidLoad()
    }

}

• tappableView하나를 만들고 시작
• Main.storyboard에 뷰 하나 만들고, tappableView와 연결
• 시뮬레이터 빌드 및 실행 - 흰 배경에 빨간 뷰가 있어야 한다.

뷰에 tap gesture recognizer 추가하는 방법은 두 가지가 있다 - 코드로 또는 인터페이스 빌더로. 결과는 똑같지만 실행 방법이 다르다.

1. Interface Builder로 뷰에 Tap Gesture Recognizer 추가하기

• Main.storyboard를 열고 Object Library(+버튼)에서 tap gesture recognizer를 아까 만든 tappableView에 추가한다.
  • 정상적으로 추가되면 왼쪽의 Document Outline에 나타난다.
• ViewController.swift를 열고 tap gesture recognizer에 대한 Action을 정의한다.
  • "Action = Interface Builder에 노출되는 메서드를 말함"
  • 해당 Action은 UITapGestureRecognizer라는 하나의 매개변수를 받는다.

// MARK: - Actions

@IBAction func didTapView(_ sender: UITapGestureRecognizer) {
    print("did tap view", sender)
}

• 다시 Main.storyboard에 가서 왼쪽 Document Outline에서 tap gesture recognizer를 선택한다
• 오른쪽 Connections Inspector를 열고, Sent Actions의 selector에서 Document Outline의 View Controller까지 드래그해 연결한다.
• didTapView(_:) Action이 나타나면 클릭해 연결한다.
• 다시 빌드하고 실행한 뒤 빨간 뷰를 클릭하면, 콘솔 창에 결과가 출력된다.
  • tap gesture recognizer 연결이 잘 된 것!

코드로 Tap Gesture Recognizer 추가하기

먼저 위에서 실습한 Interface Builder의 tap gesture recognizer를 삭제한다.

• ViewCotnroller.swift에서 viewDidLoad()메서드를 찾는다.
• UITapGestureRecognizer 인스턴스를 init(target:action:)메서드를 호출해 초기화한다.
  • target 은 뷰컨트롤러, action은 아까 정의한 didTapView(_:)로 정의한다.

// MARK: - View Life Cycle

override func viewDidLoad() {
    super.viewDidLoad()

    // Initialize Tap Gesture Recognizer
    let tapGestureRecognizer = UITapGestureRecognizer(target: self, action: #selector(didTapView(_:)))
}

// MARK: - Actions

@objc func didTapView(_ sender: UITapGestureRecognizer) {
    print("did tap view", sender)
}

• ✅ 코드로 구현할 때는 InterfaceBuilder를 사용하지 않기 때문에 @IBAction이라는 속성이 필요가 없다. 대신 @objc라는 속성이 필요하다.
  • @objc라는 속성은 그 메서드가 Objective-C 의 실행시간에 노출되도록 한다. 자세한 건 나중에 배우게 될 것..
  • @objc 속성을 빼먹으면 컴파일러 에러가 발생한다 - Argument of '#selector' refers to instance method 'didTapView' that is not exposed to Objective-C
• 마지막으로 tap gesture recognizer를 코드로 뷰에 추가해야 한다. tappableView에 addGuestureRecognizer(_:)를 호출하고, 매개변수로 tap gesture recognizer를 넘긴다.

// MARK: - View Life Cycle

override func viewDidLoad() {
    super.viewDidLoad()

    // Initialize Tap Gesture Recognizer
    let tapGestureRecognizer = UITapGestureRecognizer(target: self, action: #selector(didTapView(_:)))

    // Add Tap Gesture Recognizer
    tappableView.addGestureRecognizer(tapGestureRecognizer)
}

• 빌드 후 실행해 같은 결과가 나오는지 확인한다.

TapGestureRecognizer로 더블 탭 감지하기

tap gesture recognizer는 싱글 탭, 더블 탭, 트리플 탭을 감지할 수 있다. (기본적으로는 싱글 탭을 감지한다)

싱글 탭이 아닌 더블 탭을 감지하도록 하는 방법은 아래와 같다.

• viewDidLoad()에서 tapGestureRecognizer의 .numberOfTapsRequired를 2로 설정한다.

// MARK: - View Life Cycle

override func viewDidLoad() {
    super.viewDidLoad()

    // Initialize Tap Gesture Recognizer
    let tapGestureRecognizer = UITapGestureRecognizer(target: self, action: #selector(didTapView(_:)))

    // Configure Tap Gesture Recognizer
    tapGestureRecognizer.numberOfTapsRequired = 2

    // Add Tap Gesture Recognizer
    tappableView.addGestureRecognizer(tapGestureRecognizer)
}

• 빌드 후 실행해 싱글 탭이 아닌 더블 탭에만 didTapView(_:)메서드가 실행되는지 확인한다.