[swift] Swift에서 NumberMorphView를 이용하여 타이머 구현하기

29 Nov 2023

swift

이 포스트에서는 Swift 프로그래밍 언어를 사용하여 NumberMorphView를 이용하여 타이머를 구현하는 방법을 알아보겠습니다.

NumberMorphView란 무엇인가요?

NumberMorphView는 Swift에서 사용할 수 있는 UIView 서브클래스입니다. 이 뷰를 사용하면 매끄러운 숫자 애니메이션을 구현할 수 있습니다. 우리는 이를 이용하여 타이머를 구현해보겠습니다.

프로젝트 설정하기

NumberMorphView를 사용하려면 프로젝트에 NumberMorphView 라이브러리를 추가해야 합니다. CocoaPods를 이용하여 라이브러리를 설치하는 방법을 다음과 같습니다.

터미널을 열고 프로젝트 디렉토리로 이동합니다.
Podfile을 생성하고 아래 내용을 입력합니다.

platform :ios, '10.0'
use_frameworks!

target 'YourApp' do
  pod 'NumberMorphView'
end

터미널에서 pod install을 실행하여 라이브러리를 설치합니다.

타이머 구현하기

먼저, 뷰 컨트롤러에 NumberMorphView를 추가합니다.

import Foundation
import UIKit
import NumberMorphView

class TimerViewController: UIViewController {
    
    @IBOutlet weak var numberView: NumberMorphView!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        // NumberMorphView 설정
        numberView.animationDuration = 1.0 // 애니메이션의 지속 시간
        numberView.textAlignment = .center // 숫자 텍스트의 정렬
        
        // 초기 숫자 설정
        numberView.currentDigit = 0
    }
    
    // 타이머 시작
    func startTimer() {
        Timer.scheduledTimer(timeInterval: 1.0, target: self, selector: #selector(updateTimer), userInfo: nil, repeats: true)
    }
    
    // 타이머 업데이트
    @objc func updateTimer() {
        numberView.nextValue() // 다음 숫자로 변경하여 애니메이션 실행
    }
    
    // 타이머 멈춤
    func stopTimer() {
        numberView.stopAnimation()
    }
    
    // 타이머 초기화
    func resetTimer() {
        numberView.currentDigit = 0
    }
}

이제 타이머를 시작, 멈추거나 초기화하기 위해 버튼 액션을 추가합니다.

@IBAction func startButtonTapped(_ sender: UIButton) {
    startTimer()
}

@IBAction func stopButtonTapped(_ sender: UIButton) {
    stopTimer()
}

@IBAction func resetButtonTapped(_ sender: UIButton) {
    resetTimer()
}

인터페이스 빌더에서 버튼을 추가하고 각각의 버튼에 적절한 액션을 연결합니다.

결론

이제 Swift에서 NumberMorphView를 사용하여 타이머를 구현하는 방법을 알아보았습니다. NumberMorphView를 사용하면 매끄러운 숫자 애니메이션을 손쉽게 구현할 수 있습니다.