[안드로이드] Lottie 3.0.7 적용기 (json 파일 재생 라이브러리)

기존 안드로이드 프로젝트에 튜토리얼 단계에 적용하고자 GIF 에셋을 활용했었는데(Glide 라이브러리),

 

GIF의 단점은 사이즈가 대체적으로 커질 수 있다는 점과, 기기별로 재생 속도가 천차만별로 달라지던

 

현상이 발생한다는 것이었다.

 

 

이를 대체하기 위해 새로 도입하게 된 게 JSON 애니메이션이다.

 

JSON은 현재 여타 웹사이트에도 다양하게 적용되고 있는 애니메이션 포맷인데,

 

이를 안드로이드 등 기타 플랫폼에서 간편하게 적용이 가능하도록 만들어진 Lottie 라이브러리를 추가로

 

알게되었다.

---

 

Lottie의 상세 소개는 아래에서.

 

https://airbnb.design/lottie/

Lottie

안드로이드 적용은 아래 페이지 참조.

 

https://airbnb.io/lottie/#/android

Lottie Docs

 

그리고 아래에서는 Lottie에 업로드 및 즉시 테스트 가능한 에셋들을 다운로드 및 직접 업로드 테스트가 가능.

 

https://lottiefiles.com/

LottieFiles - Free animation files build for Lottie, Bodymovin

매우 간편하며 안드로이드 앱을 통해 즉시 테스트도 가능하다.

 

- 테스트 할 json을 업로드하면 각 에셋에 해당하는 QR코드가 생성됨.

- 이를 안드로이드 기기에서 Lottie 공식 앱으로 촬영시 즉시 재생시의 모습과 오류 발생시 오류 내용까지 확인이 가능! 

 

---

 

헌데 Lottie 라이브러리 최신버전(19년 8월 적용시점 기준 3.0.7)을 적용하고 난 뒤에 문제가 발생하였는데,

 

프로젝트 빌드 자체가 안된다는 것이었다.

 

이를 해결하기 위해 Lottie의 이전 버전들(2.x)을 테스트 해보았으나, 이전 버전은 괜히 이전버전이 아닌지라

 

기존에 디자이너분께 받은 JSON 파일과 호환이 안되는 이슈가 발생해 이러기도 저러기도 갑갑한 상황이 되었다.

(JSON의 경우 BodyMovin 5.3 버전으로 빌드 된 에셋이었음)

 

 

이후 해결점을 찾아내었는데, Lottie의 최신버전을 사용하려면 안드로이드 프로젝트를

 

안드로이드X로 마이그레이션 해야한다는 것이었다.

 

마이그레이션 진행은 안드로이드 스튜디오 최신버전의 경우 큰 문제없이 간편히 진행이 가능하니 참고.

- Refactor > Migrate to AndroidX > 마이그레이션 진행 > 완료 이후 프로젝트 빌드 및 이슈 제거

 

프로젝트의 안드로이드X로 마이그레이션을 마친 뒤 Lottie의 최신버전을 적용해보았고, 

 

별탈 없이 BodyMovin 5.5 버전에서 만들어진 json 파일을 재생하는 것을 확인할 수 있었다.

 

 

마지막으로 강조하고 싶은 점은

 

기타 Lottie의 적용 포스트들에서는 적용 코드와 레이아웃 코드를 함께 쓰는 것처럼

 

나와 있는 포스트들이 몇개 있는데, 코드 없이 레이아웃 XML 코드만으로 적용이 가능하다는 점

 

짚고 넘어가는 것이 좋겠다! (결론적으로 로티는 코드 or  레이아웃 코드로 적용이 가능하다)