상태 기반 애니메이션
→ 현재 상태에서 변경된 상태로 자연스럽게 전환됨
transform
→ 뷰의 크기(scale), 위치(translation), 회전(rotation)을 변경하는 속성
애니메이션은 움직이는게 아니고 특정 상태로 바뀌도록 선언하는 방식이다.
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)
}
)
}
CGAffineTransform(scaleX: 1.06, y: 1.06)
이 코드는 뷰를 1.06배로 확대한다.
UIView.animate는 현재 크기(1.0)에서 1.06까지 중간 값을 자동으로 계산해서 부드럽게 확대시킨다.
옵션을 보면
결과적으로 “커졌다 작아졌다”가 반복되는 pulse 효과가 된다.
CGAffineTransform(translationX: 0, y: -6)
이건 뷰를 위로 6pt 이동시키는 코드
여기서도 마찬가지로
그래서 위아래로 떠다니는 느낌이 만들어짐
어떻게 움직일지를 직접 계산하지 않고 최종 상태만 정의