본문 바로가기
프로그래밍 놀이터/안드로이드, Java

Android Transition Framework (TransitionManager, Transition, Scene) 의 작동 원리

by 돼지왕 왕돼지 2014. 4. 30.
반응형

Android Transition Framework (TransitionManager, Transition, Scene) 의 작동 원리



Android Kitkat Transition 의 원리.


참조 : http://lucasr.org/2014/03/13/how-android-transitions-work/


Transition Framework


Transition 은 layout change 에 대한 animation 을 지원한다.

layout change 는 add, remove, move, resize, show, hide 등을 이야기한다.


Transition Framework 는 3개의 핵심으로 구성된다.


Scene Root, Scene, Transition.


Scene Root 는 ViewGroup 으로 Transition 이 일어나는 배경이 되는 Container 이다.

Scene 은 Scene Root 안에 들어가는 특정 Layout 상태를 말한다.

마지막으로 Transition 은 layout 의 차이를 capture 하고, animator 를 만들어 animation 시키는 역할을 한다.



Transition 은 다음과 같은 step 을 통해 수행된다.


1. 시작 상태 Capture

2. Layout Change

3. 마지막 상태 Capture

4. Animator 수행.



이 모든 과정은 TransitionManager 가 주관하지만, 위의 step 들의 세부적인 내용은 Transition 에서 처리한다.


Step 2 는 Scene change 가 되기도, layout change 가 되기도 한다.




How it works


ListView 에는 특별한 규칙을 적용한다.

ListView 의 자식들은 transition state 라는 것을 주어서, transition 중에 recycle 되지 않도록 한다.

그래서 ListView 에 새로운 아이템을 추가하거나, 기존 아이템을 제거하는 것을 쉽게 할 수 있다.

adapter에 변경을 inform 하기 전에 beginDelayedTransition 를 불러주기만 하면 된다.


Transition 을 상속한 class 들은 Layout change 혹은 Scene change 가 발생하면, 내부적으로 TransitionValues 에 view state 를 capture 해 놓는다.

TransitionValues는 transition 시켜야 하는 view 들의 집합으로, Map 을 사용해 구현되어 있다.





TransitionManager 는 OnPreDrawListener 에 listener 를 추가하고선 다음 rendering frame 을 기다린다.

OnPreDrawListener 시점에서 transition 이 될 view 들은 target size, position 등을 알 수 있다.

이 시점에 end state 를 capture 한다.


이 시점에 pre running transition 을 update 하거나 cancel 한 후 새로운 TransitionValues 를 갖고 animator 를 만들어낸다.


그리고 animator 가 시작된다.




Some Extras


ChangeBounds 는 View frame( left, top, right, bottom ) 값을 조정해서 size 변화와 위치변화의 효과를 낸다.

하지만, layout 이 변할 때 layout() 이 호출되면 이것이 뭉개지는데 ChangeBounds 는 이를 어떻게 해결할까?

layout change 를 suppress 하여 transition 이 일어나는 동안 layout() 이 call 되는 것을 막는다.

( 참고 : @hide 함수 ViewGroup.supressLayout() )


Fade 의 경우도 이미 사라진 view 에 대해 임시 view 를 넣어 animation 을 돌린다.






반응형

댓글