cocoapods 설치, rvm 설치로 cocoapods 설치, podfile 생성과 수정, JSON 파일 추가,Lottie 애니메이션 뷰 추가,JSON 파일 로드 및 애니메이션 적용

cocoapods 설치하기

sudo gem install cocoapods

터미널에서 위 명령어로 cocoapods 을 설치.

이 방법이 적용이 되지 않는다면 ?

\curl -sSL [https://get.rvm.io](https://get.rvm.io/) | bash -s stable\n
source ~/.rvm/scripts/rvm\n
rvm install ruby --latest\n
rvm use ruby
gem install cocoapods

위와 같이 rvm 을 새로 설치해주어 cocoapods을 설치해준다.

그리고 cocoapods을 적용할 프로젝트의 파일에서 다음 명령어를 실행해준다.

pod init

그럼 Podfile 이 생성되는데, 이때 vim 을 이용해서 문구를 추가해도 되고 직접 텍스트 파일로 수정해도 된다.

vim 을 이용시에

vim Podfile

이런 화면이 나오는데, #Pods for lottie ~부터 시작되는 코드에서

pod 'lottie-ios'

코드를 추가해준다.

vim의 추가 단축키는 insert의 i
저장은 esc 후 :wq로 저장해준다.

이제 다시 터미널로 넘어와

pod install

명령어를 실행해 pod file을 설치한다.

그러면 디렉토리에 xcworkspace 가 뜨는것을 볼 수 있다.

여기서 xcworkspace 파일에 들어가 json file 을 넣어준다.

json파일은 app store 에 있는 LottiesFiles 를 통해서 앱을 다운 받으면 json 코드를 손 쉽게 다운받을 수 있다.

다운로드 받은 코드를 다음과 같은 설정으로 입력하면

json 파일이 정상적으로 로드 된 것을 볼 수 있다.

그럼 viewcontroller 에서

import Lottie

를 추가해주고 다음 코드를 입력하면서 마무리해준다.

 

1. 코드로 추가하기 

다른 자료에서는

이 부분이 AnimationView? 로 나와있었는데 최근 업데이트의 영향인지 Lottie를 추가해야 실행되는 것을 찾을 수 있었다.

결과 화면에서는 다음과 같은 애니매이션을 추가할 수 있다.

 

이 부분의 name : “”에는 json 파일의 이름과 동일해야함을 잊지말자.

2. 스토리보드로 추가하기 

view 를 하나 추가하고 class 에 LottieAnimationView 를 추가해준다. 

 

viewcontroller 와 animationview 를 연결해준다. 그리고 viewDidLoad 에 안에 다음 코드를 넣는다. 

animationView.contentMode = .scaleAspectFit
        animationView.loopMode = .loop
        animationView.animationSpeed = 0.5
        animationView.play()