티스토리 뷰

안드로이드 앱을 개발하다 보면 gif 이미지 처럼 애니메이션을 사용해야 하는 경우가 있습니다.
로딩이미지 혹은 기타 디자인적 완성을 높이기 위해서 애니메이션을 적용해야 하는 경우 발생되기 마련입니다.


안드로이드에서 애니메이션을 사용 하기 위해서는 크게 두가지 방법이 있습니다.


1. 프레임별 이미지로 <animation-list>에 넣어 사용하는 방법
2. gif파일을 GIFDecoder를 통해 AnimationDrawable을 사용 하는 방법


각각의 환경에 맞게 선택해서 구현하시면 되지만, 이번 포스팅에서는 1. 프레임별 이미지로 <animation-list>에 넣어 사용하는 방법에 대해서 알아보도록 하겠습니다.

애니메이션이라는 것이라는 것이 단순하게 생각하면 여러장의 이미지를 연속으로 노출함으로써 마치 이미지가 움직이는 효과를 주는 일종의 착시를 이용한 방법 입니다.
안드로이드에서는 이러한 일정시간 단위로 여러 이미지를 연속으로 표시 해주는 기능을 제공 해 주고 있습니다.

우선 애니메이션을 사용할 이미지의 프레임별 각각 이미지를 구합니다. 아래와 같이 xml를 생성 해줍니다.


1
2
3
4
5
6
7
8
9
<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="false">
    <item android:drawable="@drawable/loading_01" android:duration="500" />
    <item android:drawable="@drawable/loading_02" android:duration="500" />
    <item android:drawable="@drawable/loading_03" android:duration="500" />
    <item android:drawable="@drawable/loading_04" android:duration="500" />
  
</animation-list>
cs


간단히 코드를 보면 반복적으로 표시할 이미지의 경로를 설정 해주고 해당 이미지가 표시될 시간(duration)을 설정 해주면 연속으로 이미지가 재생 되게 됩니다.

위에 예제에서는 loading_01~ loading_04의 이미지 들이 0.5초마다 유지 된후 순차적으로 변경 하게 됩니다.

해당 xml을 생성 후 사용할 view에 넣어 주시면 이미지가 반복 재생 되게 됩니다.


1
2
3
4
5
6
<ImageView 
  android:id="@+id/img_loading" 
  android:layout_width="wrap_content" 
  android:layout_height="wrap_content" 
  android:background="@drawable/ani_loading"
  />
cs


댓글