[swift] Swift로 애니메이션을 이용한 분홍색 심박수 효과 구현하기

07 Dec 2023

swift

애니메이션은 사용자 경험을 향상시키는 강력한 도구입니다. 이번에는 Swift를 사용하여 분홍색 심박수 효과를 구현하는 방법을 알아보겠습니다.

1. 애니메이션 시작하기

import UIKit

class HeartRateViewController: UIViewController {

    @IBOutlet weak var heartImageView: UIImageView!

    override func viewDidLoad() {
        super.viewDidLoad()

        // 애니메이션 시작
        startHeartRateAnimation()
    }

    func startHeartRateAnimation() {
        UIView.animate(withDuration: 1.0, delay: 0.0, options: [.repeat, .autoreverse], animations: {
            self.heartImageView.alpha = 0.0
        }, completion: nil)
    }
}

코드에서는 HeartRateViewController 클래스를 만들고 IBOutlet을 사용하여 heartImageView를 선언합니다. viewDidLoad()에서 startHeartRateAnimation() 메소드를 호출하여 애니메이션을 시작합니다.

2. 분홍색 심박수 효과 추가하기

import UIKit

class HeartRateViewController: UIViewController {

    @IBOutlet weak var heartImageView: UIImageView!

    override func viewDidLoad() {
        super.viewDidLoad()

        // 애니메이션 시작
        startHeartRateAnimation()
    }

    func startHeartRateAnimation() {
        UIView.animate(withDuration: 1.0, delay: 0.0, options: [.repeat, .autoreverse], animations: {
            self.heartImageView.alpha = 0.0
        }, completion: nil)

        UIView.animate(withDuration: 1.0, delay: 0.5, options: [.repeat, .autoreverse], animations: {
            self.heartImageView.transform = CGAffineTransform(scaleX: 1.2, y: 1.2)
        }, completion: nil)

        UIView.animate(withDuration: 1.0, delay: 0.25, options: [.repeat, .autoreverse], animations: {
            self.heartImageView.tintColor = UIColor.systemPink
        }, completion: nil)
    }
}

startHeartRateAnimation() 메소드 안에 애니메이션을 추가하였습니다. 첫 번째 애니메이션은 alpha 값을 변경하여 이미지를 투명하게 만들고 되돌리는 애니메이션입니다. 두 번째 애니메이션은 scaleX와 scaleY를 사용하여 이미지를 확대/축소하는 애니메이션입니다. 마지막 애니메이션은 tintColor를 사용하여 이미지의 색상을 분홍색으로 변경하는 애니메이션입니다.

결론

위의 코드를 사용하여 Swift로 분홍색 심박수 효과를 구현할 수 있습니다. 이를 활용하여 애플리케이션에서 사용자에게 독특하고 시각적으로 흥미로운 경험을 제공할 수 있습니다.

1. 애니메이션 시작하기

2. 분홍색 심박수 효과 추가하기

결론

참고 자료