[스위프트]핀치 제스처로 두 손가락으로 텍스트 확대/축소하기

iOS프로그래밍(스위프트) 핀치 제스처로 두 손가락으로 텍스트 확대/축소하는 예제

 

핀치 제스처(Pinch Gesture)는 두 손가락으로 화면을 확대/축소할 때 사용하는 이벤트입니다. 화면 축소 확대/축소 기능이 들어간 모든 앱에서 사용할 수 있습니다. 이 글에서는 텍스트를 확대/축소하는 앱을 만들어보겠습니다. 

 

먼저 Xcode를 실행하고, 새 프로젝트를 생성합니다. 

▶ 새 프로젝트 만드는 방법

[스위프트] Xcode 새 프로젝트 만들기

 

 

---

■ 화면 구성하기 

STEP 1 레이블(Label)를 스토리보드에 추가합니다. 

 

 

STEP 2 레이블의 제약조건을 설정합니다. 

 

 

 

---

■ 코드 작성하기

보조편집기를 엽니다. 

STEP 3 레이블의 아울렛 변수를 추가합니다. 

레이블을 오른쪽 마우스로 클릭하여 클래스명 아래로 드래그앤드롭합니다. 

변수명은 txtPinch로 했습니다. 

 

STEP 4 글자 크기 변수 선언합니다. 

핀치 제스터가 발생했을 때 현재 글자 크기를 저장해 보겠습니다. 이를 위해 글자 크기 변수를 선언합니다. 

 

 

STEP 5 핀치 제스처 등록합니다. 

핀치 제스처는 UIPinchGestureRecognizer 클래스에 의해 인식되므로 이 클래스를 선언하고 핀치 제스처를 등록해야 합니다. 

코드설명

19번: UIPinchGestureRecognizer 클래스 상수 pinch를 선언합니다. 액션 인수는 핀치 제스처가 인식되었을 때 실행할 메서드를 의미합니다. 

20번: 뷰 객체의 UIPinchGestureRecognizer 메서드를 사용해 핀치 제스처를 사용합니다. 

 

 

STEP 6 액션 메서드 doPinch를 구현합니다. 

핀치제스처가 인식되었을 때 실행할 액션 메서드입니다. 

 

코드설명

25번: 핀치 메서드가 처음 시작하는 상태라면 현재 글자 크기를 저장하고,

27번: 핀치 제스처가 계속 진행 중이라면 저장된 글자 크기를 확대하거나 축소할 것이므로 if문을 사용합니다. 

STEP 7 앱 실행

 

 

 

 

시뮬레이터로 실습할 때는 option키를 누른 상태에서 마우스를 움직여야 합니다. 

전체코드

import UIKit

 

class ViewController: UIViewController {

    @IBOutlet var txtPinch: UILabel!

    

    var initialFontSize:CGFloat!

    

    override func viewDidLoad() {

        super.viewDidLoad()

        

        let pinch = UIPinchGestureRecognizer(target: self, action: #selector(ViewController.doPinch(_:)))

        self.view.addGestureRecognizer(pinch)

    }

    

    @objc func doPinch(_ pinch: UIPinchGestureRecognizer){

        if(pinch.state == UIGestureRecognizer.State.began) { // 핀치 제스쳐의 상태를 state 속성을 사용하여 확인

            initialFontSize = txtPinch.font.pointSize // 제스처의 상태가 시작이면 앞에서 선언한 initialFontSize 변수에 현재 텍스트의 글자 크기를 저장

        }else{

            txtPinch.font = txtPinch.font.withSize(initialFontSize * pinch.scale) // 아니라면 initialFontSize에 scale 속성을 곱하여 택스트의 글자 크기에 반영합니다.

        }

    }

}

 

 

 

 

 

 

--------------------------

iOS프로그래밍 학습을 위해

더 많은 예제 보러가기 

--------------------------