[swift] Swift 프로젝트에서 NumberMorphView를 사용한 카운트다운 타이머 구현하기

이번에는 Swift를 사용하여 NumberMorphView를 이용한 카운트다운 타이머를 구현하는 방법에 대해 알아보겠습니다. NumberMorphView는 숫자를 부드럽게 애니메이션하여 표시해주는 뷰입니다. 이를 이용하면 사용자에게 보다 시각적으로 재미있는 타이머를 제공할 수 있습니다.

NumberMorphView 설정하기

먼저, NumberMorphView를 사용하기 위해 프로젝트에 해당 라이브러리를 추가해야 합니다. 터미널에서 프로젝트 경로로 이동한 후, 다음의 명령어를 실행하여 Cocoapods를 이용해 NumberMorphView를 설치합니다.

pod 'NumberMorphView', '~> 1.0'

설치가 완료되면, 프로젝트 파일을 열고 사용할 뷰 컨트롤러에 다음의 import 구문을 추가합니다.

import NumberMorphView

카운트다운 타이머 구현하기

이제 카운트다운 타이머를 구현해보겠습니다. 먼저, Storyboard에서 뷰 컨트롤러에 NumberMorphView를 추가하고, 해당 뷰와 IBOutlet을 연결합니다. 그리고 다음의 코드를 뷰 컨트롤러에 추가합니다.

@IBOutlet weak var numberMorphView: NumberMorphView!

override func viewDidLoad() {
    super.viewDidLoad()
    
    numberMorphView.format = "%02.0f"
    numberMorphView.animationDuration = 1.0
}

func startCountdown(from initialValue: Int) {
    numberMorphView.startAnimation(to: CGFloat(initialValue), withDuration: 1.0)
    
    var countdownValue = initialValue - 1
    
    Timer.scheduledTimer(withTimeInterval: 1.0, repeats: true) { timer in
        if countdownValue >= 0 {
            self.numberMorphView.startAnimation(to: CGFloat(countdownValue), withDuration: 1.0)
            countdownValue -= 1
        } else {
            timer.invalidate()
            // 타이머 종료 처리
        }
    }
}

위 코드에서는 NumberMorphView와 관련된 설정값을 초기화하고, startCountdown 메소드에서 실제로 카운트다운을 시작합니다. 처음에는 입력받은 초기 값으로 NumberMorphView를 설정하고, 1초마다 타이머를 갱신하여 NumberMorphView의 값을 변경합니다. 타이머가 0 이하로 내려갈 경우에는 타이머를 중지하고 필요한 종료 처리를 수행합니다.

타이머 시작하기

실제로 타이머를 시작해보겠습니다. 적절한 시점에서 다음과 같이 startCountdown 메소드를 호출하여 타이머를 시작할 수 있습니다.

startCountdown(from: 10)

위 예제는 초기 값을 10으로 설정하고 카운트다운을 시작하는 예제입니다. 원하는 초기 값을 설정하여 사용하면 됩니다.

결론

이번에는 Swift에서 NumberMorphView를 사용하여 카운트다운 타이머를 구현하는 방법에 대해 알아보았습니다. NumberMorphView를 이용하면 부드러운 애니메이션 효과를 가진 타이머를 구현할 수 있습니다. 추가적으로 필요한 기능이 있다면 NumberMorphView의 공식 문서를 참고하시기 바랍니다.

참고 자료: