Android Animation Interpolator 구현하기
https://developer.android.com/reference/android/view/animation/BaseInterpolator.html
Interpolator는 한국어로 보간을 의미합니다. 보간은 두 점을 연결하는 방법이며 어떻게 궤적을 형성할 것인가를 나타냅니다.
다시말해 Interpolator는 시작시점과 종료시점까지의 변화 과정을 어떤식으로 표현 할 것 인가에 대한 것을 Animation으로 정의한 것이라 할 수 있습니다.
지금부터 Android에서 제공하는 8가지의 Interpolator와 translation, scale, alpha, rotation시에 어떻게 동작하는지 알아보겠습니다.
그래프는 y축은 가변적인 상태(scale, translation 등)이며, x축은 시간을 의미하며, 포스팅에 앞서 앞으로 등장할 모든 그래프에 대한 출처를 밝히는 바입니다.
1.Interpolator 전체 비교하기
2.AccelerateDecelerateInterpolator
AccelerateDecelerateInterpolator는 시작시점에 속도가 0으로 시작했다가 점차 증가하여 선형을 나타내며, 종료시점에 속도가 다시 0으로 감소합니다.
3.AccelerateInterpolator
시작시점에 속도가 0으로 시작하여 점점 증가합니다.
4.AnticipateInterpolator
시작시점에서 속도가 음수로 되어 뒤로 이동 하였다가 급가속하여 종료시점으로 빠르게 이동합니다.(활시위를 당기는 것 같습니다.)
5.OvershootInterpolator
급가속을하여 종료시점을 조금 지난 후에 천천히 종료시점으로 돌아옵니다.
6.BounceInterpolator
종료시점에 도착 후에 공이 튀듯이 몇번 바운스(?)를 한 이후에 다시 종료시점으로 돌아갑니다.
7.CycleInterpolator
시작시점에서 끝점까지 이동하고 (-)끝점으로 빠르게 이동 후 시작지점으로 돌아옵니다.(말하기가 어렵네요 보시면 바로 이해 되실겁니다.)
8.DecelerateInterpolator
종료시점에 속도가 점점 감소합니다.
9.LinearInterpolator
일정한 속도로 이동합니다.
마무리
이번 포스팅은 gif파일이 많아 다소 멈추는 느낌이 있습니다. 하지만 애니메이션은 눈으로 보는게 가장 중요하다고 판단하여 포스팅에 포함된 모든 애니메이션을 포함하도록 노력하였습니다.
Interpolator와 ViewpropertyAnimator를 결합한다면 복잡한 UX도 훌륭하게 구성 할 수 있으며 저도 현재 실무에서 가장 많이 사용하는 애니메이션입니다.
같이보면 좋은 글 입니다.
전체 소스코드는 깃허브에 올려두도록 하겠습니다.
https://github.com/gus0000123/InterpolatorSample
이상 안드로이드 개발자 이종현이었습니다.
재밌게 읽으셨다면 👏🏻눌러 주시는 것도 잊지말아주세요~ 저에게 큰 힘이됩니다. :)
읽어주셔서 감사합니다.
