IOS - Lottie(오픈소스)

로티:

- 에어비앤비에서 제공하는 오픈소스.

- JSON형태로 변환된 일명 움짤이라고 불리는 GIF파일이나 짧은 일러스트파일을 이미지뷰에 뿌려주는 편리하고 자주쓰이는 플랫폼

 

설치방법

코코아팟을 활용하여 추가한다.

1. 프로젝트가 있은 폴더를 우클릭, 폴더에서 새로운 터미널 열기

2. 터미널 창에서 pod init을 입력하고 엔터를 누르고 폴더에 들어가면 podfile이 만들어져있다.

3. podfile을 열어서  pod 'lottie-ios' 입력

  # Pods for 프로젝트이름
    pod 'lottie-ios'

3. 터미널로 돌아가서 pod install

m1맥이고 오류가 난다면

$ sudo arch -x86_64 gem install ffi
$ arch -x86_64 pod install

4. xcworkspace로 작업한다.

 

5. command + b를 눌러 빌드해준다

 

6. 사용할 위치에서 import lottie를 해준다.

 

---

사용방법

아무것도 없는 일반 View의 클래스를 로티에서 제공해주는 AnivationView로 설정한다.

이렇게 되면 Module가 Lottio로 설정된다.

뷰를 @IBIoutlet으로 연결시켜준다.

애니메이션으로 추가할 파일을 프로젝트 내부로 드래그 앤 드롭 해준다.

 

        let animationView = AnimationView(name: "끌어온파일 이름")
        lottieView.contentMode = .scaleAspectFill //컨텐츠모드
        lottieView.addSubview(animationView)	//서브뷰생성
        animationView.frame = lottieView.bounds	//가져온 JSON파일의 바운스에 맞춘다.
        animationView.loopMode = .loop		//반복모드
        animationView.play()			//애니메이션뷰 시작!