画像をアニメーションさせる
|Androidでは簡単にアニメーションを使うことができます。
アニメーションの種類は以下のものがあります。
AlphaAnimation | オブジェクトの透明度が変化するアニメーション |
RotateAnimation | オブジェクトの角度が変化するアニメーション |
ScaleAnimation | オブジェクトの大きさが変化するアニメーション |
TranslateAnimation | オブジェクトの位置が変化するアニメーション |
AnimationSet | 上記のアニメーションを組み合わせる |
詳しい説明は続きからどうぞ。
それでは各アニメーションの使い方を順番に紹介していきます。
以下のようなImageViewオブジェクトに対してアニメーションを適用させてみます。
ImageView img = (ImageView) findViewById(R.id.ImageView01);
AlphaAnimation
オブジェクトの透明度を変化させるアニメーションです。
フェードイン・フェードアウトのような効果になります。
AlphaAnimation alpha = new AlphaAnimation(1, 0.1f); // 透明度を1から0.1に変化させる alpha.setDuration(3000); // 3000msかけてアニメーションする img.startAnimation(alpha); // アニメーション適用
AlphaAnimationのコンストラクタに渡すパラメータで透明度の変化の具合を指定します。
値の有効範囲は0.0〜1.0で、0.0で完全に透明に、1.0で完全に不透明になります。
上のサンプルコードでは透明度を1から0.1に変化させているので、徐々に透明になっていきます。
RotateAnimation
オブジェクトの角度を変化させるアニメーションです。
ぐるぐるとオブジェクトが回転するアニメーションになります。
RotateAnimation rotate = new RotateAnimation(0, 360, img.getWidth()/2, img.getHeight()/2); // imgの中心を軸に、0度から360度にかけて回転 rotate.setDuration(3000); // 3000msかけてアニメーションする img.startAnimation(rotate); // アニメーション適用
RotateAnimationのコンストラクタに指定するパラメータは以下のようになっています。
RotateAnimation(float fromDegrees, float toDegrees, float pivotX, float pivotY);
・float fromDegrees:回転の開始角度
・float toDegrees:回転の終了角度
・float pivotX:回転のX軸の値
・float pivotY:回転のY軸の値
上のサンプルコードではimgの中心を回転の軸として、0度から360度にかけて回転させています。
ScaleAnimation
オブジェクトの大きさを変化させるアニメーションです。
簡単にオブジェクトを拡大・縮小させることができます。
ScaleAnimation scale = new ScaleAnimation(1, 0.5f, 1, 0.5f); // imgを1倍から0.5倍に縮小 scale.setDuration(3000); // 3000msかけてアニメーションする img.startAnimation(scale); // アニメーション適用
コンストラクタのパラメータは以下の通りです。
ScaleAnimation(float fromX, float toX, float fromY, float toY);
・float fromX:アニメーション開始時のXスケール
・float toX:アニメーション終了時のXスケール
・float fromY:アニメーション開始時のYスケール
・float toY:アニメーション開始時のYスケール
上のサンプルコードではimgを半分の大きさに縮小させています。
TranslateAnimation
オブジェクトの位置を変化させるアニメーションです。
オブジェクトが移動しているような効果になります。
TranslateAnimation translate = new TranslateAnimation(0, 100, 0, 100); // (0,0)から(100,100)に移動 translate.setDuration(3000); // 3000msかけてアニメーションする img.startAnimation(translate); // アニメーション適用
コンストラクタのパラメータは以下の通りです。
TranslateAnimation(float fromX, float toX, float fromY, float toY);
・float fromXDelta:アニメーション開始時のX位置(移動量)
・float toXDelta:アニメーション終了時のX位置(移動量)
・float fromYDelta:アニメーション開始時のY位置(移動量)
・float toYDelta:アニメーション終了時のY位置(移動量)
上のサンプルコードではimgを(0,0)から(100,100)の位置に移動させています。
AnimationSet
上記のアニメーションを組み合わせることができます。
AnimationSet set = new AnimationSet(true); RotateAnimation rotate = new RotateAnimation(0, 360, img.getWidth()/2, img.getHeight()/2); // imgの中心を軸に、0度から360度にかけて回転 set.addAnimation(rotate); ScaleAnimation scale = new ScaleAnimation(1, 0.5f, 1, 0.5f); // imgを1倍から0.5倍に縮小 set.addAnimation(scale); set.setDuration(3000); // 3000msかけてアニメーションする img.startAnimation(set); // アニメーション適用
上のサンプルコードではimgを回転させながら縮小させています。