[swift] Swift Core Animation을 활용한 투명도 변화 애니메이션

07 Dec 2023

swift

Core Animation은 iOS 애플리케이션에서 애니메이션 효과를 만들기 위해 사용되는 강력한 도구입니다. 이번 글에서는 Core Animation을 활용하여 투명도를 변화시키는 애니메이션을 구현하는 방법을 살펴보겠습니다.

프로젝트 설정

먼저, Xcode에서 iOS 프로젝트를 생성하고 필요한 리소스를 추가해주세요. 이 예제에서는 간단한 뷰를 사용하므로, Main.storyboard에서 뷰 컨트롤러에 UIView를 추가하고 해당 뷰를 아울렛으로 연결해주세요.

Core Animation을 활용한 투명도 애니메이션

Core Animation을 사용하려면 CALayer를 사용하여 애니메이션을 적용할 객체를 생성해야 합니다. 따라서, 아울렛으로 연결한 뷰의 레이어를 사용하도록 코드를 작성해보겠습니다.

import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var animationView: UIView!

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

    override func viewDidAppear(_ animated: Bool) {
        super.viewDidAppear(animated)
        
        // 애니메이션을 적용할 레이어를 생성합니다.
        let animationLayer = CALayer()
        animationLayer.frame = animationView.bounds
        animationLayer.backgroundColor = UIColor.red.cgColor
        
        // animationView의 레이어에 애니메이션 레이어를 추가합니다.
        animationView.layer.addSublayer(animationLayer)
        
        // 애니메이션 효과를 생성합니다.
        let animation = CABasicAnimation(keyPath: "opacity")
        animation.duration = 2.0
        animation.fromValue = 1.0
        animation.toValue = 0.0
        animation.repeatCount = .infinity
        
        // 애니메이션을 레이어에 적용합니다.
        animationLayer.add(animation, forKey: "opacityAnimation")
    }
}

위의 코드에서는 viewDidAppear 메서드에서 애니메이션을 적용하도록 했습니다. 이렇게 하면 화면이 나타나는 시점에서 애니메이션이 시작됩니다.

CALayer를 사용하여 레이어를 생성하고, 해당 레이어의 배경색을 UIColor.red.cgColor로 설정했습니다. 이렇게 생성한 레이어를 애니메이션 뷰의 레이어에 추가하는 작업을 수행하였습니다.

애니메이션 효과를 생성하기 위해 CABasicAnimation을 사용하였습니다. 여기서는 opacity 속성을 사용하여 투명도를 조절하는 애니메이션을 생성했습니다.

애니메이션의 속성들을 설정한 후, 레이어에 애니메이션을 추가한 뒤, add 메서드의 첫 번째 인자로 CABasicAnimation 객체를 전달하고, 두 번째 인자로 애니메이션의 식별자를 설정하여 애니메이션을 적용합니다.

실행 결과

이렇게 구현한 애니메이션을 실행해보면, 뷰의 배경색이 2초 동안 서서히 투명해지는 애니메이션 효과를 확인할 수 있습니다.

Core Animation을 사용하면 다양한 애니메이션 효과를 구현할 수 있으며, 애플리케이션에 동적인 움직임을 부여할 수 있습니다.

참고 자료

Core Animation Programming Guide