iOS

UIView animate 파헤치기

UIKit, animation, iOS

iOS의 Animation 🕹

iOS Framework 에서 애니메이션을 구현하는 방법은 여러가지가 있다.
아래 내용에 해당하는 UIView의 animate, 그리고 궁극적으로 알아야 할 Core Animation을 활용한 애니메이션 등이 있다.

소개합니다😃 UIView.animate🕺

iOS4에서 부터 코드 블럭 문법(클로져)이 도입 되면서 추가된 UIView 계층의 애니메이션 함수.
UIView.animate(withDuration:animations:) 와 그 패밀리 함수들을 사용한다.

지속 시간, 애니메이션의 옵션(타이밍 함수 등), 완료 핸들러 등을 메소드의 각 인자로 분리하고, 애니메이션의 내용은 클로저(= 코드 블럭) 안에 작성하여 가독성을 높이고, 특히 중첩된(nested) 애니메이션 구조를 알아보기 쉽게 작성할 수 있는 장점이 있으며 가장 널리 쓰이는 애니메이션이다.

UIView.animate(withDuration: 1.5) {
  myView.transform = CGAffineTransform.init(scaleX: 1.2, y: 0)
}

이 API와 관련된 함수들은 아래와 같은 것들이 있다.

  • +animate(withDuration:animations:) – 기본 타이밍 함수를 이용
  • +animate(withDuration:animations:completion:) – 완료핸들러를 추가
  • +animate(withDuration:delay:options:animations:completion:) – 딜레이 및 다른 애니메이션 옵션을 사용할 수 있게 한다.
  • +animate(withDuration:delay: usingSpringWithDamping:initialSpringVelocity: options:animations:completion:) – 일반적인 곡선 타이밍 함수가 아닌 스프링에 의한 타이밍 함수를 사용하여 애니메이팅하는 함수 (iOS10)

animate는 UIView의 어떤 property를 이용할까?

여러 뷰 속성에 대한 변경은 애니메이션 할 수 있다.
즉, 속성을 변경하면 현재 값에서 시작하여 지정한 새 값으로 끝나는 애니메이션이 생성된다.
UIView 클래스의 다음 속성은 애니메이션이 가능하다.

  • frame
  • bounds
  • center
  • transform
  • alpha
  • backgroundColor

animate의 parameter

duration: TimeInterval

  • 애니메이션의 총 지속 시간(초 단위)
  • 음수 값 or 0 을 지정하면 변경 내용이 애니메이션 되지 않고 수행 된다.

delay: TimeInterval

  • 애니메이션을 시작하기 전에 기다리는 시간(초 단위)
  • 애니메이션을 즉시 시작하려면 값을 0으로 지정하면 된다.

usingSpringWithDamping dampingRatio: CGFloat

  • 대기 상태에 가까워질 때 스프링 애니메이션의 댐핑 비율
  • 진동 없이 애니메이션을 부드럽게 감속하려면 1의 값을 사용한다.
  • 0에 가까운 댐핑 비율을 적용하여 진동을 증가시킬 수 있다.

initialSpringVelocity velocity: CGFloat

  • 초기 스프링 속도
  • 애니메이션을 원활하게 시작하려면 이 값을 첨부하기 전과 같이 뷰의 속도에 일치시킨다.
  • 1의 값은 1초 만에 횡단한 총 애니메이션 거리에 해당한다. 예를 들어, 전체 애니메이션 거리가 200포인트이고 애니메이션의 시작을 100ppt/s의 보기 속도와 일치시키려면 0.5의 값을 사용하면 된다.

options: UIView.AnimationOptions = []

animations: @escaping () -> Void

  • 뷰에 커밋할 변경 사항이 포함된 블록 개체
  • 여기서 뷰 계층에 있는 뷰의 애니메이션 가능한 속성을 프로그래밍 방식으로 변경할 수 있다.
  • 이 블록은 매개 변수를 사용하지 않으며 반환 값이 없다.
  • 이 매개 변수는 NULL이어서는 안 된다.

completion: ((Bool) -> Void)? = nil

  • 애니메이션 시퀀스가 종료될 때 실행할 블록 객체
  • 이 블록은 반환 값이 없으며 완료 처리기가 호출되기 전에 애니메이션이 실제로 완료되었는지 여부를 나타내는 단일 Bool 인수를 취한다.
  • 애니메이션의 지속시간이 0일 경우, 이 블록은 다음 실행 루프 사이클의 시작 부분에서 수행된다.
  • 이 파라미터는 NULL일 수 있다.
Share