[내일배움캠프 12주차 (03/23)]

yeseul jang·2026년 3월 23일

내일배움캠프

목록 보기
25/32

📌 1. UIView.animate

  • UIView.animate는 iOS에서 가장 기본적인 애니메이션 방식
  • 값을 바꾸면, 그 변화 과정을 자동으로 부드럽게 만들어준다
  • 상태 기반 애니메이션
    → 현재 상태에서 변경된 상태로 자연스럽게 전환됨

  • transform
    → 뷰의 크기(scale), 위치(translation), 회전(rotation)을 변경하는 속성

애니메이션은 움직이는게 아니고 특정 상태로 바뀌도록 선언하는 방식이다.


📌 2. 예시

private func startAnimations() {
    startPulseAnimation()
    startFloatingAnimation()
}

private func startPulseAnimation() {
    UIView.animate(
        withDuration: 1.0,
        delay: 0,
        options: [.autoreverse, .repeat, .allowUserInteraction],
        animations: {
            self.circleContainerView.transform = CGAffineTransform(scaleX: 1.06, y: 1.06)
        }
    )
}

private func startFloatingAnimation() {
    UIView.animate(
        withDuration: 1.2,
        delay: 0,
        options: [.autoreverse, .repeat, .allowUserInteraction],
        animations: {
            self.rocketImageView.transform = CGAffineTransform(translationX: 0, y: -6)
        }
    )
}

📌 3. 예시 설명

📘 첫 번째 애니메이션은 scale을 사용함

CGAffineTransform(scaleX: 1.06, y: 1.06)

이 코드는 뷰를 1.06배로 확대한다.
UIView.animate는 현재 크기(1.0)에서 1.06까지 중간 값을 자동으로 계산해서 부드럽게 확대시킨다.

옵션을 보면

  • repeat → 계속 반복
  • autoreverse → 다시 원래 크기로 돌아감

결과적으로 “커졌다 작아졌다”가 반복되는 pulse 효과가 된다.

📘 두 번째 애니메이션은 translation을 사용함

CGAffineTransform(translationX: 0, y: -6)

이건 뷰를 위로 6pt 이동시키는 코드

여기서도 마찬가지로

  • 현재 위치 → 위로 이동
  • autoreverse → 다시 내려옴
  • repeat → 반복

그래서 위아래로 떠다니는 느낌이 만들어짐

어떻게 움직일지를 직접 계산하지 않고 최종 상태만 정의

profile
iOS 개발

0개의 댓글