[Android] Property Animation 画像が回転して落ちていく

Property Animaton を使って、画像を回転させながら移動、落ちていく演出を作ってみます。何かで使えそうなので。
　

Android Studio
2021.2.1

Property Animation

Animationを実現させるためには他にも方法がありますが、Property Animationは画像だけでなくObjectも扱えること。その対象物の位置の具体的な座標など(property)を毎回変更しながら動かすというところです。View AnimationではAnimationを見せているだけでそのもののpropertyは変わっていません。
　

目次
1. Animator クラス
2. Animator.AnimatorListener
3. サンプルコード
4. サンプル動画

Animator クラス

Animator
- Property Animationのためのスーパークラス
ValueAnimator
- Animatorを継承したクラスでanimationの中間データを計算
ObjectAnimator
- ValueAnimatorを継承したクラスで対象Objectに値を設定する
AnimatorSet
- Animatorを継承したクラスで、幾つかのAnimatorをグループ化できる

Objectの移動には

translationX, x
- x軸方向移動
translationY, y
- y軸方向移動

が使えます。他にも

rotation, rotationX, and rotationY
- 2D, 3Dの回転
scaleX and scaleY
- 2Dのスケーリング
pivotX and pivotY
- 回転やスケーリングの起点座標を変える
alpha
- 透明度の変更

などを使ってanimationすることができます。

Animator.AnimatorListener

AnimatorListenerを実装することにより、Objectのアニメーションをモニターして、開始、キャンセル、終了、コールバック状態を知ることができます。
　

    public void addListener(Animator.AnimatorListener listener);
    ...
    // アニメーション開始で呼ばれる
    @Override
    public void onAnimationStart(Animator animation) {    }

    // アニメーションがキャンセルされると呼ばれる
    @Override
    public void onAnimationCancel(Animator animation) {    }

    // アニメーション終了時
    @Override
    public void onAnimationEnd(Animator animation) {    }

    // 繰り返しでコールバックされる
    @Override
    public void onAnimationRepeat(Animator animation) {    }

public void addListener(Animator.AnimatorListener listener);

...

// アニメーション開始で呼ばれる

@Override

public void onAnimationStart(Animator animation) { }

// アニメーションがキャンセルされると呼ばれる

@Override

public void onAnimationCancel(Animator animation) { }

// アニメーション終了時

@Override

public void onAnimationEnd(Animator animation) { }

// 繰り返しでコールバックされる

@Override

public void onAnimationRepeat(Animator animation) { }

サンプルコード

x, yの移動と回転animationを組み合わせた例です。

MainActivity.java

//package your.package.name;

import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.animation.PropertyValuesHolder;
import android.animation.Animator;
import android.animation.ObjectAnimator;
import android.util.Log;
import android.widget.Button;
import android.widget.ImageView;


public class MainActivity extends AppCompatActivity
        implements Animator.AnimatorListener{

    private ImageView imageView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        Button buttonStart = findViewById(R.id.button_start);
        imageView = findViewById(R.id.image_view);
        imageView.setImageResource(R.drawable.bag);

        // Animation 開始
        buttonStart.setOnClickListener(v -> setAnimetion());
    }

    private void setAnimetion(){
        // PropertyValuesHolderを使ってＸ軸方向移動範囲のpropertyを保持
        PropertyValuesHolder vhX = PropertyValuesHolder.ofFloat(
                "translationX",
                0.0f,
                600.0f );

        // PropertyValuesHolderを使ってＹ軸方向移動範囲のpropertyを保持
        PropertyValuesHolder vhY = PropertyValuesHolder.ofFloat(
                "translationY",
                0.0f,
                1200.0f );

        // PropertyValuesHolderを使って回転範囲のpropertyを保持
        PropertyValuesHolder vhRotaion = PropertyValuesHolder.ofFloat(
                "rotation",
                0.0f,
                360.0f );

        // ObjectAnimatorにセットする
        ObjectAnimator objectAnimator = ObjectAnimator.ofPropertyValuesHolder(
                imageView,
                vhX ,
                vhY ,
                vhRotaion );

        // 再生時間を設定 3000msec=3sec
        objectAnimator.setDuration(3000);

        // リスナーを設定
        objectAnimator.addListener(this);

        // アニメーションを開始する
        objectAnimator.start();
    }

    // アニメーション開始で呼ばれる
    @Override
    public void onAnimationStart(Animator animation) {
        Log.d("debug","onAnimationStart()");
    }

    // アニメーションがキャンセルされると呼ばれる
    @Override
    public void onAnimationCancel(Animator animation) {
        Log.d("debug","onAnimationCancel()");
    }

    // アニメーション終了時
    @Override
    public void onAnimationEnd(Animator animation) {
        Log.d("debug","onAnimationEnd()");
    }

    // 繰り返しでコールバックされる
    @Override
    public void onAnimationRepeat(Animator animation) {
        Log.d("debug","onAnimationRepeat()");
    }
}

//package your.package.name;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;

import android.animation.PropertyValuesHolder;

import android.animation.Animator;

import android.animation.ObjectAnimator;

import android.util.Log;

import android.widget.Button;

import android.widget.ImageView;

public class MainActivity extends AppCompatActivity

implements Animator.AnimatorListener{

private ImageView imageView;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

Button buttonStart = findViewById(R.id.button_start);

imageView = findViewById(R.id.image_view);

imageView.setImageResource(R.drawable.bag);

// Animation 開始

buttonStart.setOnClickListener(v -> setAnimetion());

}

private void setAnimetion(){

// PropertyValuesHolderを使ってＸ軸方向移動範囲のpropertyを保持

PropertyValuesHolder vhX = PropertyValuesHolder.ofFloat(

"translationX",

0.0f,

600.0f );

// PropertyValuesHolderを使ってＹ軸方向移動範囲のpropertyを保持

PropertyValuesHolder vhY = PropertyValuesHolder.ofFloat(

"translationY",

0.0f,

1200.0f );

// PropertyValuesHolderを使って回転範囲のpropertyを保持

PropertyValuesHolder vhRotaion = PropertyValuesHolder.ofFloat(

"rotation",

0.0f,

360.0f );

// ObjectAnimatorにセットする

ObjectAnimator objectAnimator = ObjectAnimator.ofPropertyValuesHolder(

imageView,

vhX ,

vhY ,

vhRotaion );

// 再生時間を設定 3000msec=3sec

objectAnimator.setDuration(3000);

// リスナーを設定

objectAnimator.addListener(this);

// アニメーションを開始する

objectAnimator.start();

}

// アニメーション開始で呼ばれる

@Override

public void onAnimationStart(Animator animation) {

Log.d("debug","onAnimationStart()");

}

// アニメーションがキャンセルされると呼ばれる

@Override

public void onAnimationCancel(Animator animation) {

Log.d("debug","onAnimationCancel()");

}

// アニメーション終了時

@Override

public void onAnimationEnd(Animator animation) {

Log.d("debug","onAnimationEnd()");

}

// 繰り返しでコールバックされる

@Override

public void onAnimationRepeat(Animator animation) {

Log.d("debug","onAnimationRepeat()");

}

　
activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="#db9"
    tools:context=".MainActivity">

    <ImageView
        android:id="@+id/image_view"
        android:contentDescription="@string/description"
        android:layout_width="200dp"
        android:layout_height="200dp" />

    <Button
        android:id="@+id/button_start"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="4dp"
        android:text="@string/start" />

</LinearLayout>

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:tools="http://schemas.android.com/tools"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:orientation="vertical"

android:background="#db9"

tools:context=".MainActivity">

<ImageView

android:id="@+id/image_view"

android:contentDescription="@string/description"

android:layout_width="200dp"

android:layout_height="200dp" />

<Button

android:id="@+id/button_start"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_margin="4dp"

android:text="@string/start" />

</LinearLayout>

　
リソース
strings.xml

<resources>
    <string name="app_name">YourAppName</string>
    <string name="description">bag</string>
    <string name="start">Start</string>
</resources>

<string name="app_name">YourAppName</string>

<string name="start">Start</string>

</resources>