iOS/UIKit

Swift) UIView.animate,UILabel Blink animation[ UIView 애니메이션, UILabel 깜빡이게 하기]

skyiOS 2023. 7. 25. 02:22
반응형

UIView.animate란?

UIView.animate는 iOS의 UIKit 프레임워크에서 제공하는 메서드로, 애니메이션을 적용하고자 하는 UIView의 속성을 변경하는 데 사용됩니다. 이를 통해 시각적인 변화를 자연스럽게 만들거나 사용자 경험을 향상시킬 수 있습니다.


애니메이션 구현을 위한 메서드

UIKit에서는 UIView의 클래스 메서드로 다음과 같이 사용합니다:

UIView.animate(withDuration: 0.5, delay: 0, options: .curveEaseInOut, animations: {
    // 애니메이션 적용할 속성들
}, completion: nil)
- withDuration: 애니메이션의 지속 시간을 초 단위로 설정합니다.
- animations: 애니메이션의 중간 상태를 정의하는 클로저입니다. 애니메이션 실행 중에 변경되는 속성들을 지정합니다.
- completion: 애니메이션이 완료된 후 호출될 클로저를 정의합니다. 이곳에서 애니메이션 완료 후 수행할 작업을 처리합니다.
- delay: 애니메이션을 시작하기 전에 대기해야 하는 시간을 설정합니다. 애니메이션이 시작되기 전까지의 지연 시간을 초 단위로 나타냅니다. 
- options: 애니메이션의 실행 옵션을 설정합니다. 배열 형태로 여러 옵션을 함께 사용할 수도 있습니다.
  • .curveEaseInOut: 애니메이션을 천천히 시작하고 끝나는 등 속도가 완만하게 변화하는 옵션
  • .curveEaseIn: 애니메이션을 천천히 시작하는 옵션.
  • .curveEaseOut: 애니메이션을 천천히 끝내는 옵션.
  • .autoreverse: 애니메이션을 왕복하는 옵션.
  • .repeat: 애니메이션을 반복하는 옵션.
반응형

구현 예시

import UIKit

class BlinkingLabelViewController: UIViewController {

    @IBOutlet weak var resultLabel: UILabel!
    
    var isBlinking = false // 깜박이는 상태
    
    func startBlinkingAnimation() {
            UIView.animate(withDuration: 0.5, delay: 0, options: [.autoreverse, .repeat], animations: {
                self.resultLabel.alpha = 0 // 라벨의 투명도를 0으로 설정하여 깜빡이게 만듭니다.
            }, completion: nil)
        }
    
    func stopBlinkingAnimation() {
           self.resultLabel.layer.removeAllAnimations() // 애니메이션 멈춤 이거만 적용했더니 라벨이 사라짐
           self.resultLabel.alpha = 1 // 라벨의 투명도를 원래대로 복원 * 필수
       }
       
       @IBAction func BlinkingLable(_ sender: UIButton) {
        isBlinking.toggle()
        if isBlinking{
            startBlinkingAnimation()
        }else {
            stopBlinkingAnimation()
        }
            
    }
}
startBlinkingAnimation() 함수: 이 함수는 깜빡이는 애니메이션을 시작하는데 사용됩니다.
1. UIView.animate 메서드를 호출하여 0.5초 동안 라벨의 투명도를 0으로 만들어 라벨이 깜빡이는 효과를 얻을 수 있도록 합니다.
2. 애니메이션의 옵션으로 .autoreverse와 .repeat을 지정하여 애니메이션이 완료된 후 다시 되돌아오고, 반복 실행되도록 합니다.
stopBlinkingAnimation() 함수: 이 함수는 깜빡이는 애니메이션을 멈추고 라벨을 원래대로 되돌리는데 사용됩니다.
1. 라벨의 레이어에 적용된 모든 애니메이션을 제거하는 removeAllAnimations() 메서드를 호출하여 애니메이션을 정지시킵니다.
2. 그리고 라벨의 투명도를 다시 1로 설정하여 애니메이션이 멈추고 원래 상태로 돌아오도록 합니다.
★ 해당 코드를 작성 하지 않으면 투명도가 0인 상태로 애니메이션이 정지되어, 라벨 텍스트가 사라집니다.

실행 화면

실행 화면

 

반응형