この記事ではアニメーションの実装方法とアニメーションの終了を待ってから次の処理を行う実装方法について書いていきたいと思います。
具体的には、ImageViewを回転させて回転アニメーションの終了を待ってから次の画面へ遷移する実装となります。
完成イメージ
今回の実装によるアニメーションは以下のようになります。
以下からは実装について書いていきます。
ImageViewをレイアウトに用意する
アニメーションさせるImageViewをレイアウトXMLファイルに以下のように定義します。
<ImageView
android:id="@+id/masterKeyIcon"
android:layout_width="30dp"
android:layout_height="30dp"
android:scaleType="centerCrop"
android:src="@drawable/ic_key_icon" />
アニメーションの定義ファイルを用意する
どのようにアニメーションさせるのかを定義したファイルをリソースフォルダ「res」の配下に「anim」というフォルダを作成して、その配下に定義ファイルを用意します。
この例では、画像の中心を軸として反時計回りに90度回転させるrotate_animation.xmlを用意します。
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:interpolator="@android:anim/decelerate_interpolator"
android:fromDegrees="0.0"
android:toDegrees="-90.0"
android:pivotX="50%"
android:pivotY="50%"
android:fillAfter="true"
android:duration="300" />
それぞれの設定は以下のような意味となります。
・fromDegreesとtoDegreesは何度から何度まで回転させるかの設定です
・pivotXとpivotYは回転させるX軸とY軸の座標で50%なので中心を指しています
・fillAfterはアニメーション終了後にその状態を保つかどうかです
・durationはアニメーションをする時間(msec)になります
アニメーションを開始する実装
対象のImageViewにアニメーションを設定して開始後に次の画面に遷移する実装は以下のようになります。
loginBtn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View arg0) {
ImageView masterKeyIcon = findViewById(R.id.masterKeyIcon);
// アニメーションのロード
Animation rotateAnimation = AnimationUtils.loadAnimation(activity, R.anim.rotate_animation);
// アニメーションの開始
masterKeyIcon.startAnimation(rotateAnimation);
// 次の画面へ遷移
Intent intent = new Intent(activity, NextActivity.class);
startActivity(intent);
}
});
loadAnimationでアニメーションを読み出した後、startAnimationでアニメーションを開始します。
この実装では、続けてその後startActivityをしていますが、この実装だとアニメーションが終了する前に次の画面に遷移してしまい、うまく動きません。
アニメーションの終了を待つ実装に変更
そこで、アニメーションの終了を待ってから次の画面に遷移する実装は以下のようになります。
loginBtn.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View arg0) {
ImageView masterKeyIcon = findViewById(R.id.masterKeyIcon);
// アニメーションのロード
Animation rotateAnimation = AnimationUtils.loadAnimation(activity, R.anim.rotate_animation);
// アニメーションの終了通知を受けるリスナーの設定
rotateAnimation.setAnimationListener(new Animation.AnimationListener() {
@Override
public void onAnimationStart(Animation animation) {
}
@Override
public void onAnimationEnd(Animation animation) {
// 次の画面へ遷移
Intent intent = new Intent(activity, NextActivity.class);
startActivity(intent);
}
@Override
public void onAnimationRepeat(Animation animation) {
}
});
// アニメーションの開始
masterKeyIcon.startAnimation(rotateAnimation);
}
});
このように、アニメーションにsetAnimationListenerでリスナーを設定する事で、onAnimationEndがアニメーションの終了時に呼び出されます。
そのメソッドに画面遷移処理を実装することでアニメーション終了後に画面遷移をすることができるようになります。
