Animation

Animation

연산을 통해서 Animation효과를 만드는 방법을 말한다.

쉽게 풀어서 얘기하면 view의 위치를 이동, 회전, 확대/축소, 투명도 조절을 할 수 있다.

1. 투명 애니메이션 (alpha)

   alpha값을 설정하여,

   대상의 투명도의 변화를 애니메이션으로 구현

   // 투명 상태에서 1초 동안 서서히 모습이 드러나는 애니메이션
   
   <?xml version="1.0" encoding="utf-8"?>
   <alpha xmlns:android="http://schemas.android.com/apk/res/android"
       android:interpolator="@android:anim/linear_interpolator"
       android:duration="1000"
       android:fromAlpha="0.0"
       android:toAlpha="1.0">
   </alpha>

   uration : 실행 시간

   fromAlpha : 시작 투명도 (0 = 완전히 투명)

   toAlpha : 끝 투명도 (1.0 = 완전히 보임)

   Alpha 값은 0 ~ 1.0 사이에서 조절 가능

2. 확장 애니메이션 (scale)

   scale값을 설정하여

   대상의 크기를 확대하거나 축소하는 애니메이션을 구현할 수 있다.

   // 1초 동안 크기 0에서 2배 크기로 확대되는 애니메이션
   <?xml version="1.0" encoding="utf-8"?>
   <scale xmlns:android="http://schemas.android.com/apk/res/android"
       android:interpolator="@android:anim/linear_interpolator"
       android:duration="1000"
       android:pivotX="50%"
       android:pivotY="50%"
       android:fromXScale="0.0"
       android:toXScale="2.0"
       android:fromYScale="0.0"
       android:toYScale="2.0">
   </scale>

   duration : 실행 시간

   pivotX : X축 값 (50% = X축 중앙)

   pivotY : Y축 값 (50% = Y축 중앙)

   fromXScale : 시작 X축 크기 (0.0 = 0)

   toXScale : 끝 X축 크기 (2.0 = 두 배 크기)

   fromYScale : 시작 Y축 크기 (0.0 = 0)

   toYScale : 끝 Y축 크기 (2.0 = 두 배 크기)

3. 이동 애니메이션 (translate)

   X, Y Delta값을 설정하여

   대상을 상하좌우로 이동하는 애니메이션을 구현

   // 1초 동안 동남쪽으로 이동하는 애니메이션
   <?xml version="1.0" encoding="utf-8"?>
   <translate xmlns:android="http://schemas.android.com/apk/res/android"
       android:interpolator="@android:anim/linear_interpolator"
       android:duration="1000"
       android:fromXDelta="0"
       android:toXDelta="100%"
       android:fromYDelta="0"
       android:toYDelta="200%">
   </translate>

   duration : 실행 시간

   fromXDelta : 시작 X축 값 (0 = 처음 자리)

   toXDelta : 끝 X축 값 (100% = 오른쪽으로 100만큼 이동)

   fromYDelta : 시작 Y축 값 (0 = 처음 자리)

   toYDelta : 끝 Y축 값 (200% = 아래쪽으로 200만큼 이동)

4. 회전 애니메이션 (rotate)

   X, Y pivot 값과, Degree값을 설정하여

   대상을 회전하는 애니메이션을 구현할 수 있다.

   // 1초 동안 360도 회전하는 애니메이션
   <rotate xmlns:android="http://schemas.android.com/apk/res/android"
       android:interpolator="@android:anim/linear_interpolator"
       android:duration="1000"
       android:pivotX="50%"
       android:pivotY="50%"
       android:fromDegrees="0"
       android:toDegrees="360">
   </rotate>

   duration : 실행 시간

   pivotX : X축 중심값 (50% = X축 중앙)

   pivotY : Y축 중심값 (50% = Y축 중앙)

   fromDegrees : 시작 각도 (0 : 회전 0도)

   toDegrees : 끝 각도 (360 : 회전 360도)

5. 복합 세트 애니메이션 (set)

    태그를 사용하여 여러 애니메이션을 셋뚜셋뚜로 구현할 수도 있다.

   애니메이션이 동시에 실행된다.

   예상하던 결과와 다를 수 있기 때문에 세심한 작업이 필요

   // 1초 동안 투명에서 불투명으로 되면서, 크기가 2배로 커지고,
   // 동남쪽으로 이동하면서, 360도 도는 애니메이션
   <?xml version="1.0" encoding="utf-8"?>
   <set xmlns:android="http://schemas.android.com/apk/res/android"
       android:interpolator="@android:anim/linear_interpolator">
       <alpha
           android:duration="1000"
           android:fromAlpha="0.0"
           android:toAlpha="1.0" />
       <scale
           android:duration="1000"
           android:pivotX="50%"
           android:pivotY="50%"
           android:fromXScale="0.0"
           android:toXScale="2.0"
           android:fromYScale="0.0"
           android:toYScale="2.0" />
       <translate
           android:duration="1000"
           android:fromXDelta="0"
           android:toXDelta="100%"
           android:fromYDelta="0"
           android:toYDelta="200%"/>
       <rotate
           android:duration="1000"
           android:pivotX="50%"
           android:pivotY="50%"
           android:fromDegrees="0"
           android:toDegrees="360">
       </rotate>
   </set>

6. interpolator

   각 애니메이션은 interpolator 값을 설졍할 수 있다.

   interpolator는 한글로 번역하면 더 어려워진다.

   간단히 부속 속성이라고 보면 편하다.

   예를 들어 가장 기본인 linear_interpolator 를 사용하면 애니메이션 등속으로 진행되고 accelerate_interpolator 를 사용하면, 애니메이션 진행에 가속이 붙어서 처음에는 느리다가 빠르게 진행된다.