[ISSUE] Lottie Animation 백그라운드 진입 후 멈춤 현상

이번 포스팅은 Lottie 애니메이션 사용시 발생했던 이슈에 대해 포스팅 하려 한다.

 

 

필자는 Lottie 애니메이션이 동작하고 있는 뷰를 그리고 있었다.

그리고 작업 마무리 시점에 테스트 도중 애니메이션과 연관된 이슈를 만나게 되었다.

이슈 내용은 백그라운드 진입후 포어그라운드로 재진입시 애니메이션의 동작이 멈춰있는 현상이 발생하고 있었던것이였다.

 

.....

 

그리하여 그다지 무겁지 않았던 이번 이슈의 리졸브 경험을 기록하려 한다.

해당 작업은 사내 프로젝트이기 때문에 새로운 프로젝트로 포스팅을 이어나가보겠다.

세팅 작업으로는 Lottie 파일 1개와 AnimationView를 준비했다.

그리고 애니메이션의 play 동작 호출까지 작성을 했다.

class ViewController: UIViewController {

    private let animationView = AnimationView(name:"67522-weee")
    @IBOutlet weak private var lottieView: UIView!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        setLottie()
    }
    
    override func viewDidAppear(_ animated: Bool) {
        super.viewDidAppear(animated)
        self.animationView.play()
    }
    
    private func setLottie() {
        self.lottieView.addSubview(self.animationView)
        self.animationView.snp.makeConstraints { make in
            make.edges.equalToSuperview()
        }
        self.animationView.loopMode = .loop
    }
}

 

애니메이션이 잘동작한다.

하지만 백그라운드를 진입했다가 다시 돌아오면 멈춰있다.

 

 

기획 요건에는 애니메이션이 유지되어야 한다. or 아니다. 유지는 딱히 안해도 된다. 이런말은 따로 기재 되어있지 않았었다.

하지만 UX 개선이 이럴때 쓰라는 말이지 않을까.. 궁시렁거리며 어김없이 구글링을 해본다.

 

역시나 같은 문제와 조우한 개발자들, 그리고 좋아요를 받은 은인이 존재하고있었다.

내용은 이렇다.

백그라운드 진입시 일시 정지하고 포어그라운드에 도달하면 다시 동작하게 만드는 설정을 해줘야 한다는 것이다.

 

animationView.backgroundBehavior = .pauseAndRestore

 

AnimationView에서 제공하는 backgroundBehavior 속성에 대해 알아보자면

앱이 백그라운드로 이동할 때 AnimationView의 동작을 설명한다고 한다.

기본값은 애플리케이션이 백그라운드로 이동할 때 애니메이션을 일시 중지하는 pause.

그래서 애니메이션이 멈춰있었던 것이다.

 

이상 lottie 애니메이션 이슈 포스팅을 마치겠다.