SwiftUI에서 탭을 전환할때 animation이 이상하게 작동하는 경우

• Counting sheep with jellyfish 앱을 업데이트하며 느낀점입니다.

SwiftUI에서는 TabView를 사용하여 여러개의 탭을 만들어서 사용할 수 있습니다.(물론 여러개라고 해서 100개씩 만들면 안되고 애플의 가이드라인을 지키는것이 좋지만)
하지만 서로다른 탭을 전환하는 과정에서 생각한것과 다르게 동작하여서 문제가 발생할 수 있습니다.
오늘은 제가 마주한 문제에 대해 써보려고 글을 쓰게 되었습니다.
먼저 SwiftUI에서 서로다른 탭을 전환할때 제가 생각하기에는 탭을 전환할때마다 View가 사라지고 다시 그 탭으로 전환했을때 호출하고 초기화하고 그리는방식으로 동작할 줄 알았는데 그게 아니었고 예를들어 탭1 에서 어떤 반복적인 애니메이션을 동작시키고 탭2를 갔다가 다시 탭1로 돌아오면 그 애니메이션이 실행되는 방식으로 작동한다는걸 알게되었습니다.

물론 전체적인 앱이 자연스럽게 동작하게 하려면 그렇게 하는게 좋지만 뭔가 탭별로 서로 분리하여서 만들고 싶을때는 어떻게 하면 좋을지 생각을 해보게 되었고, onAppear와 onDisappear modifier를 사용하여서 초기 세팅을 하면 좋지않을까 라는 생각에 시도해보게 되었는데 애니메이션이 생각과 다르게 동작하였습니다.

1. opacity modifier를 사용하여서 글자들을 사라지고, 나타나게 만들었던 거였는데 이것이 잘 작동하지 않았던 이유는 modifier는 화면에서 안보이게 투명하게 해주는것이지 View에서 지우는것이 아니어서 오류가 발생했던것 같습니다. 그래서 이 오류는 if-else와 transition을 사용하여 수정하였습니다.
2. tap을 할때마다 해파리가 위아래로 움직이는 애니메이션을 구현하고 싶었습니다. 그런데 View가 지속되니까 Tap을 할때마다 해파리에게 애니메이션을 주게되면 애니메이션이 겹쳐서 제대로 잘 동작하지 않는것을 확인하였습니다. 그래서 if-else를 사용하여서 View가 onAppear, onDisappear될때마다 해파리를 실제 View에서 지우고 나타내는 방식으로 에러를 수정하였습니다.
3. 마지막에러는 Dispatchqueue.main.asyncAfter API를 사용하여서 발생하였는데, 이 API는 탭이 전환되어도 취소가 되지않고 남아있는것으로 생각됩니다. 하지만 탭이 전환되면 남아있는 연산을 취소하고 싶었습니다. 그래서 찾아본 결과 Dispatchqueue.main.asyncAfter API가 아니라 Timer를 사용하여 onAppear, onDisappear에서 호출하고 취소하면 해결할 수 있지 않을까 라는 생각을 하게 되었고 해결하였습니다.