- Android
- 2011-11-30 - 更新:2011-12-09
この記事は最終更新日から1年以上経過しています。
ImageViewをアニメーションさせてみます。
まずはコードでアニメーションを設定する方法を紹介します。
以下のようなImageViewがあったとします。
<ImageView id="@+id/img" android:src="@drawable/icon" android:layout_width="wrap_content" android:layout_height="wrap_content" />
ImageViewオブジェクトを生成
ImageView img = (ImageView)findViewById(R.id.img);
移動するアニメーション【TranslateAnimation】
//TranslateAnimation(float fromX, float toX, float fromY, float toY) TranslateAnimation translate = new TranslateAnimation(0, 10, 0, 0); //動作時間を設定(単位ms) translate.setDuration(1000); //繰り返す回数を設定(1度でよい場合は設定しない) translate.setInterpolator(new CycleInterpolator(3)); //アニメーションを開始 img.startAnimation(translate);
透明度が変化するアニメーション【AlphaAnimation】
//AlphaAnimation(float fromAlpha, float toAlpha) AlphaAnimation alpha = new AlphaAnimation(1, 0); //動作時間を設定(単位ms) alpha.setDuration(1000); //繰り返す回数を設定(1度でよい場合は設定しない) alpha.setInterpolator(new CycleInterpolator(3)); //アニメーションを開始 img.startAnimation(alpha);
回転するアニメーション【RotateAnimation】
//RotateAnimation(float from, float to, float pivotX, float pivotY) RotateAnimation rotate = new RotateAnimation(0, 360, 30, 90); //動作時間を設定(単位ms) rotate.setDuration(1000); //アニメーションを開始 img.startAnimation(rotate);
スケールを変更するアニメーション【ScaleAnimation】
//ScaleAnimation(float fromX, float toX, float fromY, float toY, float pivotX, float pivotY) ScaleAnimation scale = new ScaleAnimation(1,2,1,2, 30, 90); //動作時間を設定(単位ms) scale.setDuration(1000); //繰り返す回数を設定(1度でよい場合は設定しない) scale.setInterpolator(new CycleInterpolator(1)); //アニメーションを開始 img.startAnimation(scale);
アニメーションを組み合わせる【AnimationSet】
//AnimationSet(boolean shareInterpolator) AnimationSet set = new AnimationSet(true); //回転しながら set.addAnimation(rotate); //スケールが変化 set.addAnimation(scale); //繰り返す回数を設定(1度でよい場合は設定しない) set.setInterpolator(new CycleInterpolator(1)); //アニメーションを開始 img.startAnimation(set);
次にリソースにアニメーションをXMLで定義しておく方法を紹介します。
個別アニメーションは割愛し、setのみ紹介。
まずはresフォルダーにanimを作成し、新規にXMLファイルを作成します。
※XMLファイルを作成する際、「Tween Animation」を指定して作成するので、
animフォルダーは勝手に作ってくれます。
[anime_set.xml]
<?xml version="1.0" encoding="utf-8"?> <set xmlns:android="http://schemas.android.com/apk/res/android" android:interpolator="@android:anim/accelerate_interpolator" android:shareInterpolator="true" android:fillAfter="true"> <scale android:duration="1000" android:fromXScale="1.0" android:toXScale="1.5" android:fromYScale="1.0" android:toYScale="1.5" android:pivotX="50%" android:pivotY="50%" /> <alpha android:duration="1000" android:fromAlpha="0.0" android:toAlpha="1.0" /> </set>
アニメーションをセット
ImageView img = (ImageView)findViewById(R.id.img); Animation Anim = AnimationUtils.loadAnimation(this, R.anim.anime_set); cameraButton.setAnimation(Anim);
xmlns:android | “http://schemas.android.com/apk/res/android”を指定。ルート要素のみ必要 |
---|---|
android:duration | アニメーション時間をミリ秒で設定 |
android:fillAfter | アニメーション後の状態を保つ(true/false) |
android:fillBefore | アニメーション後に開始状態に戻す(true/false) |
android:fillEnabled | fillBeforeとfillAfterの制御 |
android:interpolator | Interpolatorを設定 |
android:repeatCount | 繰り返し回数を設定(無限に繰り返す場合は-1) |
android:repeatMode | 繰り返しモードを設定(restart/reverse) |
android:startOffset | 開始遅延時間を設定 |
android:zAdjustment | Zオーダーを設定 |
AccelerateDecelerateInterpolator | 加速と減速 |
---|---|
AccelerateInterpolator | 加速 |
AnticipateInterpolator | 開始時に逆方向に溜める |
AnticipateOvershootInterpolator | 開始時に逆方向に溜め、終了時にはみ出す |
BounceInterpolator | 終了時にバウンド |
CycleInterpolator | 設定したアニメーションの負の方向も使用しながら繰り返す |
DecelerateInterpolator | 減速 |
LinearInterpolator | 変化を加えない |
OvershootInterpolator | 終了時にはみ出す |
例) @android:anim/accelerate_interpolator @android:anim/accelerate_decelerate_interpolator |
alpha |
android:fromAlpha 開始透明度を指定(0.0から1.0) android:toAlpha 終了透明度を指定(0.0から1.0) |
---|---|
rotate |
android:fromDegrees 開始角度を指定(0~360) android:toDegrees 終了角度を指定(0~360) android:pivotX 回転X軸を指定 android:pivotY 回転Y軸を指定 |
scale |
android:fromXScale 開始Xサイズを指定(1.0が元サイズ) android:toXScale 終了Xサイズを指定(1.0が元サイズ) android:fromYScale 開始Yサイズを指定(1.0が元サイズ) android:toYScale 終了Yサイズを指定(1.0が元サイズ) android:pivotX 原点X座標を指定 android:pivotY 原点Y座標を指定 |
translate |
android:fromXDelta 開始位置X座標を指定(-100%~100%) android:toXDelta 終了位置X座標を指定(-100%~100%) android:fromYDelta 開始位置Y座標を指定 android:toYDelta 終了位置Y座標を指定 |
set | android:shareInterpolatorInterpolatorを共有するかどうかを指定 |
18,053 views