-
[CoreAnimation] Ch12. Layer Keyframe Animations and Struct Properties (레이어의 키프레임 애니메이션을 알아보자.)Ray Wenderlich/Core Animation 2018. 8. 27. 13:42
12장 Layer Keyframe Animations and Struct Properties
Intro
UIView의 키프레임 애니메이션에서는 여러 뷰의 여러 프로퍼티를 동시에 애니메이션 처리할 수 있었다.
하지만 Layer에서는 하나의 레이어, 하나의 프로퍼티에 대해서만 키프레임 애니메이션이 가능하다.
Introducing keyframe animations
CAKeyframeAnimation에서는 fromValue와 toValue를 사용하지 않는다.
대신, values라는 value의 리스트를 사용한다. 그리고 values의 시간에 관한 프로퍼티도 필요하다. (0과 1사이의 상대시간값)
Creating a layer keyframe animation
CAKeyframeAnimation또한 CAAnimation의 서브클래스.
하지만 CABasicAnimation과 달리 values, keyTimes을 셋팅하여 애니메이션을 구현한다.
Animating struct values
이전까지는 CGPoint와 같은 struct프로퍼티의 애니메이션을 다루지 않았다. 이제 struct프로퍼티의 애니메이션을 해보자.
Swift에서는 struct가 1급객체에 해당한다. 하지만 Core Animation은 C기반으로 만든 Objective-C 프레임워크다. 즉, struct의 동작방식이 Swift와 다르다는 것이다.
Objective-C의 API는 Objects를 주로 다루기 때문에 struct를 다루려면 뭔가 조치가 필요함.
CALayer에는 CGPoint타입의 position, CATransform3D타입의 transform 등 애니메이션이 가능한 struct가 존재한다.
얘네는 애니메이션을 어떻게 하냐? struct를 애니메이션하기 위한 NSValue를 사용하면 된다.
NSValue는 여러 struct타입을 감싸기 위한 convenience initializer를 제공한다.
init(cgPoint: CGPoint)
init(cgSize: CGSize)
init(cgRect: CGRect)
init(caTransform3D: CATransform3D) 등
let move = CABasicAnimation(keyPath: "position")
move.duration = 1.0
move.fromValue = NSValue(cgPoint: CGPoint(x: 100.0, y: 100.0))
move.toValue = NSValue(cgPoint: CGPoint(x: 200.0, y: 200.0))
이렇게 사용하면된다.
만약 fromValue와 toValue에 NSValue(_:)를 사용하지 않고 바로 CGPoint(_:_:)를 사용했다면??
작동하지 않는다!!(아마도 Swift3부터) NSValue로 랩핑하지 않아도 되는 것 같다.
keyFrame애니메이션의 values에도 마찬가지다. values를 [CGPoint]타입으로 주면 작동하지 않는다. [NSValue]타입으로 주도록 하자.
Intermediate keyframe animations
TIP: 화면에 이미지를 띄우고 싶지만 UIView의 기능(오토레이아웃, 제스쳐 등)이 굳이 필요하지 않다면 CALayer의 contents를 사용하는 것도 괜찮다.
키프레임 애니메이션을 사용하면 values에 할당된 위치에 따라 layer가 이동하는걸 볼 수 있다.
근데 이 이동경로가 곡선이 되길 원한다면 15장에서 만나볼 수 있다.
'Ray Wenderlich > Core Animation' 카테고리의 다른 글
[CoreAnimation] Ch14. Gradient Animation (그라데이션 애니메이션) (0) 2018.09.01 [CoreAnimation] Ch13. Shaped and Masks (0) 2018.09.01 [CoreAnimation] Ch11. Layer Springs (레이어단의 스프링 애니메이션) + (CASpringAnimation) (0) 2018.08.09 [CoreAnimation] Ch10. Groups and Advanced Timing (애니메이션 그룹과 커스텀 타이밍) (2) 2018.08.08 [CoreAnimation] Ch9. Animation Keys and Delegates (레이어 애니메이션 Delegate, Key를 사용하기) (0) 2018.08.01