[2017.09.17] 06. 안드로이드 애니메이션

개념

애니메이션의 종류는

Property Animation, View Animation이 있다. 가장 큰 특징은 

Property Animation은 애니메이션 후 대상의 외관과 속성 모두 변경

View Animation은 애니메이션 후 대상의 외관만 변경 된다.

예를 들어, 버튼에 '이동'하는 애니메이션을 적용 할 때,

Property Animation은 버튼이 이동 후 이동 위치에서 클릭 가능

View Animation은 버튼이 이동 후 이동 위치에 클릭 불가능(버튼 모양만 이동, 실제 버튼은 이전 위치 존재) 하다.

(출처 - https://developer.android.com/guide/topics/graphics/prop-animation.html)

구분	Property Animation	View Animation
장점	View와 non-View 모두 사용 가능	View 사용 가능(non-View 제약)
단점	코드양이 많고 셋팅 시간이 길다.	코드가 간결하고 셋팅 시간이 짧다.

애니메이션을 구현 방법은

1) Xml 설정 후 Java 코드에서 Load하는 방법

2) Java 코드에서 설정 후 Load하는 방법

실습

실습은 다음과 같이 4가지 방법을 할 예정이다.

View 애니메이션 - Xml 설정 후 Activity에서 Load

1. Activity 코드

public class MainActivity extends AppCompatActivity {
    // ...
    // ...
    private void viewXMLMove() {
        // xml로 설정한 애니메이션 로드
        Animation animation = AnimationUtils.loadAnimation(this, R.anim.viewmove);
 
        // 해당 애니메이션을 타켓에 설정
        target.startAnimation(animation);
    }
    // ...
    // ...
}

2. Xml 코드

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromXDelta="0"
    android:fromYDelta="0"
    android:toXDelta="300"
    android:toYDelta="300"
    android:duration="3000"
    android:fillAfter="true"
    >
</translate>
 

View 애니메이션 - Activity에서 설정 후 Load

1. Activity 코드

public class MainActivity extends AppCompatActivity {
    // ...
    // ...
    private void viewJAVAMove() {
        Animation animation = new TranslateAnimation(0, -300, 0, -300);
        animation.setDuration(3000);
        animation.setFillAfter(true);
 
        target.startAnimation(animation);
    }
    // ...
    // ...
}

Property 애니메이션 - Xml 설정 후 Activity에서 Load

1. Activity 코드

public class MainActivity extends AppCompatActivity {
    // ...
    // ...
    private void propXMLMove() {       
        // xml로 설정한 애니메이션 로드
        Animator animation = AnimatorInflater.loadAnimator(this, R.animator.propmove);
 
        // 해당 애니메이션을 타켓에 설정
        animation.setTarget(target);
        animation.start();
    }    
    // ...
    // ...
}

※ 주의할 점은 Property 애니메이션는 res/animator 폴더에 xml을 생성해야 정상 실행된다.
(View 애니메이션은 res/anim 폴더에 생성) 이것 때문에....... 엄청 삽질했다.....

2. Xml 코드

<set xmlns:android="http://schemas.android.com/apk/res/android">
    <objectAnimator
        android:propertyName="x"
        android:fromXDelta="0"
        android:toXDelta="-30"
        android:duration="3000"
        android:fillAfter="true"/>
 
    <objectAnimator
        android:propertyName="y"
        android:fromYDelta="0"
        android:toYDelta="30"
        android:duration="3000"
        android:fillAfter="true"/>
</set>

Property 애니메이션 - Activity에서 설정 후 Load

1. Activity 코드

public class MainActivity extends AppCompatActivity {
    // ...
    // ...
    private void propJAVAMove() {
        ObjectAnimator aniX = ObjectAnimator.ofFloat(
            target,          
            "translationX", 
            300             
        );
 
        ObjectAnimator aniY = ObjectAnimator.ofFloat(
            target,          
            "translationY", 
            -300             
        );
 
        AnimatorSet aniSet = new AnimatorSet();
        aniSet.playTogether(aniX, aniY);
        aniSet.start();
    }
    // ...
    // ...
}

# 안드로이드 애니메이션 #property animation #view animation