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