[swift] Swift Core Animation의 위치 애니메이션과 이동 경로

07 Dec 2023

swift

Swift에서 Core Animation을 사용하면 애니메이션을 쉽게 만들고 제어할 수 있습니다. 이 중에서도 위치 애니메이션이 많이 사용되며, 애니메이션을 통해 객체를 원하는 위치로 이동시킬 수 있습니다. 또한, 이동 경로를 정의하여 보다 복잡한 애니메이션을 만들 수도 있습니다.

이 포스트에서는 Swift를 사용하여 Core Animation을 이용하여 위치 애니메이션을 만드는 방법과 이동 경로를 정의하는 방법을 살펴보겠습니다.

위치 애니메이션 만들기

Core Animation에서 위치 애니메이션을 만들려면 UIView의 layer 속성을 사용해야 합니다. 다음은 위치 애니메이션을 만드는 예시 코드입니다.

let view = UIView(frame: CGRect(x: 100, y: 100, width: 100, height: 100))
view.backgroundColor = UIColor.red
self.view.addSubview(view)

let animation = CABasicAnimation(keyPath: "position")
animation.fromValue = NSValue(cgPoint: view.layer.position)
animation.toValue = NSValue(cgPoint: CGPoint(x: 200, y: 200))
animation.duration = 1.0
view.layer.add(animation, forKey: "positionAnimation")

이 코드는 빨간색으로 채워진 정사각형 view를 생성하고, 애니메이션을 만듭니다. fromValue와 toValue 속성을 사용하여 애니메이션의 시작 위치와 목표 위치를 정의합니다. duration 속성은 애니메이션의 지속 시간을 결정합니다.

위의 예시 코드를 실행하면, view가 처음 위치에서 목표 위치로 부드럽게 이동하는 애니메이션이 만들어집니다.

이동 경로 정의하기

위치 애니메이션은 직선적인 이동만 가능한 것이 아닙니다. 실제로 객체를 베지어 곡선 경로 등으로 이동시킬 수도 있습니다. CAKeyframeAnimation을 사용하여 이동 경로를 정의할 수 있습니다. 다음은 베지어 곡선 경로로 위치 애니메이션을 만드는 예시 코드입니다.

let view = UIView(frame: CGRect(x: 100, y: 100, width: 100, height: 100))
view.backgroundColor = UIColor.red
self.view.addSubview(view)

let animation = CAKeyframeAnimation(keyPath: "position")
animation.values = [
    NSValue(cgPoint: view.layer.position),
    NSValue(cgPoint: CGPoint(x: 200, y: 200)),
    NSValue(cgPoint: CGPoint(x: 300, y: 100)),
    NSValue(cgPoint: CGPoint(x: 100, y: 300))
]
animation.keyTimes = [0.0, 0.3, 0.6, 1.0]
animation.duration = 2.0
animation.timingFunctions = [CAMediaTimingFunction(name: .easeIn),
                             CAMediaTimingFunction(name: .easeOut),
                             CAMediaTimingFunction(name: .easeInEaseOut)]
view.layer.add(animation, forKey: "positionAnimation")

위의 예시 코드에서 animation.values 속성에 경로의 각 포인트를 정의하고, animation.keyTimes 속성에 각 포인트의 타임라인 상 위치를 정의합니다. animation.timingFunctions 속성은 각 경로 세그먼트의 시간에 따른 속도를 조절할 수 있는 타이밍 함수를 정의합니다.

이 코드를 실행하면, view가 지정된 이동 경로를 따라 움직이는 애니메이션이 만들어집니다.

위치 애니메이션과 이동 경로를 사용하여 Swift Core Animation을 보다 흥미로운 애니메이션을 만들 수 있습니다. 자세한 내용은 Apple의 Core Animation Programming Guide를 참조하십시오.