[iOS] lotties-ios로 움직이는 이미지 넣기

lotties를 이용해 움지이는 이미지를 화면에 표시할 수 있습니다.

먼저 cocoaPod으로 다운을 받아주시고

pod 'lottie-ios'

lotties-ios 깃허브

 

빈 View에 받아와 넣는 예시입니다.

일단 lottie를 사용하기 위해서는 json으로 된 움직이는 파일의 정보가 담긴 파일이 필요합니다.

(알아보니 애프터이펙트 같은 툴로 만든 파일을 json으로 변환해주는 tool 같은게 있는듯 합니다.)

일단 연습용이니 다음 사이트에서 이미지를 다운 받았다는 전제로 하겠습니다.

로티 이미지

~~.json 파일을 프로젝트에 넣으면 준비가 되었습니다.

 

이제 스토리보드에 가서 View를 만들고 class를 AnimationView로 설정해 줍니다.

(AnimationView는 lottie에서 지원하는 class)

 

이제 빈view를 @IBOulet으로 가져온 후에 다음 처럼 설정해 주면 됩니다.

import Lottie

// Class 내부
@IBOutlet weak var someView: AnimationView!

let animation = AnimationView(name: "json파일 이름")
// 채우는 방식
someView.contentMode = .scaleAspectFit
// 
someView.addSubview(animation
// bound를 frame에 맞춰야 원하는 크기 대로 설정
animation.frame = someView.bounds
// 반복 설정
animation.loopMode = .여러가지
// 시작! complition handler도 있지만 없이 설정
animation.play()