Android View Animation example

Android 에서 View Animation 이라 함은 스크린에 나타낼 수 있는 다양한 View(ListView, ImageView, TextView 등)에 이동, 회전, 크기 등의 속성을 변경해가면서 화면에 출력하여 View의 움직임을 표현하는 것을 의미한다.

Matrix(행렬)을 사용하여 다양한 변환을 적용한다.

아래의 예제는 2초동안 이미지의 크기를 점차 확대하여 나타내는 내용이다.

main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android=
 "http://schemas.android.com/apk/res/android"
 android:orientation="vertical"
 android:layout_width="fill_parent"
 android:layout_height="fill_parent">
 <Button
  android:id="@+id/btn_animate"
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:text="Start Animation"/>
 <ImageView
     android:id="@+id/imageView"
     android:layout_width="fill_parent"
     android:layout_height="wrap_content"
     android:src="@drawable/duke01"/>
</LinearLayout>

ViewAnimActivity.java

package com.dearpeople.android.test.animation;

import android.app.*;
import android.os.*;
import android.util.DisplayMetrics;
import android.view.Display;
import android.view.View;
import android.widget.*;
import android.graphics.Matrix;
import android.view.animation.Animation;
import android.view.animation.LinearInterpolator;
import android.view.animation.Transformation;

public class ViewAnimActivity extends Activity {

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  this.setContentView(R.layout.main);
  ImageView imageview = (ImageView)this.findViewById(R.id.imageView);
  setupButton();
 }
 private void setupButton(){
  Button b = (Button)this.findViewById(R.id.btn_animate);
  b.setOnClickListener(new View.OnClickListener() {
   @Override
   public void onClick(View v) {
    animateImageView();
   }
  });
 }
 private void animateImageView() {
  ImageView imageView = (ImageView)this.findViewById(R.id.imageView);
  ViewAnim animation = new ViewAnim();
  imageView.startAnimation(animation);
 }
 
 //내부클래스 선언

public class ViewAnim extends Animation
 {
  public void ViewAnimation2(){}
 
  @Override
  public void initialize(int width, int height, int parentWidth, int parentHeight) {
   super.initialize(width, height, parentWidth, parentHeight);
   setDuration(2000);
   setFillAfter(true);
   setInterpolator(new LinearInterpolator());
  }
  @Override
  protected void applyTransformation(float interpolatedTime, Transformation t){
   final Matrix matrix = t.getMatrix();
   matrix.setScale(interpolatedTime, interpolatedTime);
   Display disp = getWindowManager().getDefaultDisplay();
   DisplayMetrics metrics = new DisplayMetrics();
   disp.getMetrics(metrics);
   int centerX = disp.getWidth()/2;
   int centerY = disp.getHeight()/2;
   //변환전에 대상뷰를 Matrix의 원점(좌상단 모서리)에 설정하고 변환적용 후에는 다시 원위치로 복귀하여 화면에 나타낸다
   matrix.preTranslate(-centerX, -centerY);
   matrix.postTranslate(centerX, centerY);
  }
 }
 //내부클래스 끝

/* 위의 좌표를 변경해 가면서 애니메이션의 효과를 확인해 보는 것이 좋겠다 */
}