애니메이션

애니메이션개요

.footnote[출처: https://developer.android.com/guide/topics/graphics/overview.html]


1. 드로워블 (Drawable) 애니메이션

1.1 XML 파일

1.2 자바 코드

  1. 이미지 뷰에 드로워블 애니메이션을 설정
  2. 드로워블 애니메이션 객체 생성
  3. 드로워블 애니메이션 시작
ImageView mCountDown = (ImageView) findViewById(R.id.countdown);

private void startCountDownFrameAnimation() {       
/*1*/    mCountDown.setBackgroundResource(R.drawable.frame_anim);

/*2*/    AnimationDrawable countdownAnim =
                    (AnimationDrawable)mCountDown.getBackground();
/*3*/    countdownAnim.start();
}

https://github.com/kwanulee/Android/blob/master/examples/AnimationTest/app/src/main/java/com/example/kwanwoo/animationtest/MainActivity.java#L67-L71


2. 뷰 애니메이션 (트윈 애니메이션)


2.1 XML 파일

2.2 자바 코드

ImageView mRocket = (ImageView) findViewById(R.id.rocket);
private void startRocketTweenAnimation() {
    Animation rocket_anim = AnimationUtils.loadAnimation(this, R.anim.rocket);
    mRocket.startAnimation(rocket_anim);
}

https://github.com/kwanulee/Android/blob/master/examples/AnimationTest/app/src/main/java/com/example/kwanwoo/animationtest/MainActivity.java#L79-L82


3. 프로퍼티 (Property) 애니메이션

.footnote[참고자료 https://developer.android.com/guide/topics/graphics/prop-animation.html]


ValueAnimator를 이용한 애니메이션

  1. 지정된 타입의 값을 애니메이션하기 위해서, ValueAnimator 인스턴스 생성
  2. 애니메이션 값의 변화율, 애니메이션 기간, 시작 시점 설정
  3. 애니메이션 값의 변경시에 호출될 리스너 등록 (적용 대상에 애니메이션 값 설정)
  4. 애니메이션 시작
 /*1*/ ValueAnimator positionAnimator = ValueAnimator.ofFloat(0,-mScreenHeight);
 /*2*/ positionAnimator.setInterpolator(new AccelerateDecelerateInterpolator());
       positionAnimator.setDuration(2000); 
       positionAnimator.setStartDely(2000);
 /*3*/ positionAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
            public void onAnimationUpdate(ValueAnimator valueAnimator){
                float value = (float) valueAnimator.getAnimatedValue(); // 애니메이션값 획득
                mRocket.setTranslationY(value);               // 적용대상에 값 적용
            }
        });
 /*4*/ positionAnimator.start();

ObjectAnimator를 이용한 애니메이션

  1. 타겟 객체의, 지정된 프로퍼티 값을 애니메이션하기 위해서, ObjectAnimator 인스턴스 생성
  2. 애니메이션 값의 변화율, 애니메이션 기간, 시작 시점 설정
  3. 애니메이션 시작
 /*1*/ ObjectAnimator positionAnimator = ObjectAnimator.ofFloat(
                          mRocket,                // 애니메이션 적용 타겟객체
                          "translationY",           // 변화시킬 프로퍼티 (Y 좌표 값)
                        0, -mScreenHeight);     // 값의 범위
 /*2*/ positionAnimator.setInterpolator(new AccelerateDecelerateInterpolator());    // 가속후 감속
       positionAnimator.setDuration(2000);              // 애니메이션 기간
       positionAnimator.setStartDely(2000);             // 애니메이션 시작 시점

 /*3*/ positionAnimator.start();

AnimatorSet을 이용한 애니메이션 결합

ObjectAnimator positionAnimator = ObjectAnimator.ofFloat(mRocket, "translationY",
                                    0, -mScreenHeight);
ObjectAnimator scaleXAnimator = ObjectAnimator.ofFloat(mRocket,"scaleX",1,0.1f);
ObjectAnimator scaleYAnimator = ObjectAnimator.ofFloat(mRocket,"scaleY",1,0.1f);

AnimatorSet animatorSet = new AnimatorSet();
animatorSet.playTogether(positionAnimator,scaleXAnimator,scaleYAnimator);
...
animatorSet.start();

애니메니션 리스너


애니메니션 리스너 예제

Animation.AnimationListener animationListener = new Animation.AnimationListener() {
    public void onAnimationStart(Animation animation) {…}

    public void onAnimationEnd(Animation animation) {
          finish();
          startActivity(new Intent(getApplicationContext(), SecondActivity.class));
    }

    public void onAnimationRepeat(Animation animation) {…}
};

private void startFireTweenAnimation() {
     Animation fire_anim = AnimationUtils.loadAnimation(this, R.anim.fire);
      mFirework.startAnimation(fire_anim);
     fire_anim.setAnimationListener(animationListener);
}

https://github.com/kwanulee/Android/blob/master/examples/AnimationTest/app/src/main/java/com/example/kwanwoo/animationtest/MainActivity.java#L144-L161 https://github.com/kwanulee/Android/blob/master/examples/AnimationTest/app/src/main/java/com/example/kwanwoo/animationtest/MainActivity.java#L73-L77