Androidプログラマへの道 〜 Moonlight 明日香 〜 - 回転アニメーションを行う
アニメーションフレームワークは, 以下の2種類が準備されている. 　　Viewに限らず任意のオブジェクト(View, Drawable, Fragument, etc)に対してアニメーションを実行できる. 　　Viewに対してのみアニメーションを実行できる.

アニメーションの一種である回転アニメーションを行うには, アニメータ(Animator)クラスあるいはビューアニメーション(view.Animation)クラスを利用する.


　　　　　　　　　　　↓　回転


Property Animation (API Level 11)

  • res/animator/rotate.xml
アニメーションの設定を行うXMLファイルである.
    • interpolatorは, アニメーション動作の変化を指定する. 例では, decelerate_interpolator(減速).
    • propertyNameは, アニメーションするオブジェクトのプロパティ名を指定する. 例では, Viewのrotation.
    • durationは, アニメーションの動作時間(ms)を指定する.
    • valueFromとvalueToは, 指定したpropertyのアニメーション開始/終了時の値を指定する. 例では, 画面要素の角度.
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
　　<objectAnimator
　　　　android:interpolator="@android:anim/decelerate_interpolator"
　　　　android:propertyName="rotation"
　　　　android:duration="2000"
　　　　android:valueFrom="0"
　　　　android:valueTo="90"
　　　　/>
</set>
  • Animation02.java
    • findViewByIdメソッドで, 指定したリソースインデックスのIDに対応したイメージビューのインスタンスを取得する.
    • AnimatorInflater#loadAnimatorメソッドで, アニメーション設定ファイル(rotate.xml)を読み込み, AnimatorSetを作成する.
    • AnimatorSet#setTargetメソッドで, ターゲットのオブジェクトを設定する.
    • AnimatorSet#startメソッドで, アニメーションを開始する.
package com.moonlight_aska.android.animation02;

import android.animation.AnimatorInflater;
import android.animation.AnimatorSet;
import android.app.Activity;
import android.os.Bundle;
import android.widget.ImageView;

public class Animation02 extends Activity {
　　/** Called when the activity is first created. */
　　@Override
　　public void onCreate(Bundle savedInstanceState) {
　　　　super.onCreate(savedInstanceState);
　　　　setContentView(R.layout.main);

　　　　ImageView img = (ImageView)findViewById(R.id.robot);
　　　　AnimatorSet set = (AnimatorSet)AnimatorInflater.loadAnimator(this, R.animator.rotate);
　　　　set.setTarget(img);
　　　　set.start();
　　}
}
  • res/layout/main.xml
    • 画像ファイル(robot.png)は, res/drawableフォルダの下に置く.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
　　android:layout_width="fill_parent"
　　android:layout_height="fill_parent"
　　>
<ImageView
　　android:id="@+id/robot"
　　android:layout_width="wrap_content"
　　android:layout_height="wrap_content"
　　android:layout_centerInParent="true"
　　android:src="@drawable/robot"
　　/>
</RelativeLayout>

View Animation (API Level 1)

  • res/anim/rotate.xml
アニメーションの設定を行うXMLファイルである.
    • RotateAnimationクラスで指定する属性
android:fromDegreesアニメーション開始時の画面要素の角度
andorid:toDegreesアニメーション終了時の画面要素の角度
android:pivotX回転時のX座標の基点
android:pivotY回転時のY座標の基点
    • Animationクラスで指定する属性
android:durationアニメーションの動作時間(msec)
android:fillAftertrue:アニメーション終了後にアニメーションの変換が適用
android:fillBeforetrue:アニメーション開始前にアニメーションの変換が適用
android:fillEnabledtrue:fillAfterが適用
android:repeatCountアニメーションの繰り返し回数
android:repeatModeアニメーションが終了した場合の振る舞い
android:startOffsetアニメーションが開始する前に置く時間(msec)
android:zAdjustmentアニメーション実行中のコンテンツについてZ軸方向の調整
<?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"
　　android:toDegrees="90"
　　android:pivotX="50%"
　　android:pivotY="50%"
　　android:fillAfter="true"
　　android:duration="2000"
　　/>
  • Animation02.java
    • findViewByIdメソッドで, 指定したリソースインデックスのIDに対応したイメージビューのインスタンスを取得する.
    • AnimationUtils#loadAnimationメソッドでアニメーション設定ファイル(rotate.xml)を読み込み, Animationを作成する.
    • ImageView#startAnimationメソッドでアニメーションを開始する.
package com.moonlight_aska.android.animation02;

import android.app.Activity;
import android.os.Bundle;
import android.view.animation.Animation;
import android.view.animation.AnimationUtils;
import android.widget.ImageView;

public class Animation02 extends Activity {
　　/** Called when the activity is first created. */
　　@Override
　　public void onCreate(Bundle savedInstanceState) {
　　　　super.onCreate(savedInstanceState);
　　　　setContentView(R.layout.main);

　　　　ImageView img = (ImageView)findViewById(R.id.robot);
　　　　Animation anim = AnimationUtils.loadAnimation(this, R.anim.rotate);
　　　　img.startAnimation(anim);
　　}
}