2013年11月30日土曜日

[Androidアニメーション] 5. Drawable Animation

AndroidのAPIににおける2Dアニメーションの種類は主に3種類あります。

Property Animation

Android3.0(API level 11)からサポートされ、どんなオブジェクトにもアニメーションを行うことができる
View Animation
Viewsに回転、移動、拡大縮小、透明度変換などのアニメーションが行える
Drawable Animation
パラパラ漫画のようにフレームを連続再生することができる
ここでは、Developer AndroidのDrawable Animationの中身をかいつまんで、Drawable Animationについて紹介します。

Drawable Animationとは

Drawable Animationは、Drawable リソースを使って、連続的に表示をすることによってアニメーションを作ることが出来ます。フィルムのような役割をし、順番に沿って、連続した異なった画像を表示して行く従来のアニメーションです。AnimationDrawableクラスは 
Drawable Animationのためのクラスになります。

プログラムの中で、アニメーションのフレームを定義し、AnimationDrawableクラスのAPIを使って、アニメーションを構成するフレームをリスト化したXMLファイルによって簡単に行うことが出来ます。このXMLファイルはAndroidプロジェクトのres/drawable/に置きます。この場合、アニメーションの各フレームに順番と継続時間を指定します。

XMLファイルには、ルートノードとして、<animation-list>要素と連続したフレーム<item>ノードを指定します。XMLファイルの例は以下の通りです。

<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
    android:oneshot="true">
    <item android:drawable="@drawable/rocket_thrust1" android:duration="200" />
    <item android:drawable="@drawable/rocket_thrust2" android:duration="200" />
    <item android:drawable="@drawable/rocket_thrust3" android:duration="200" />
</animation-list>
このアニメーションは、3フレームのみです。listのandroid:oneshotの属性をtrueにセットすることによって、1回で停止し、最後にラストのフレームを表示します。falseをセットするとアニメーションは繰り返します。プロジェクトのres/drawable/ディレクトリに保存されたrocket_thrust.xmlを、Viewに背景画像として指定することが出来ます。ここでのActivityの例は、ImageViewにアニメーションを加え、スクリーンにタッチした時に、アニメーションが始まるプログラムです。
AnimationDrawable rocketAnimation;
public void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.main);

  ImageView rocketImage = (ImageView) findViewById(R.id.rocket_image);
  rocketImage.setBackgroundResource(R.drawable.rocket_thrust);
  rocketAnimation = (AnimationDrawable) rocketImage.getBackground();
}
public boolean onTouchEvent(MotionEvent event) {
  if (event.getAction() == MotionEvent.ACTION_DOWN) {
    rocketAnimation.start();
    return true;
  }
  return super.onTouchEvent(event);
}
AnimationDrawableで呼ばれるstart()は、onCreate()の中では呼ぶことができません。AnimationDrawableがウィンドウ上にまだ配置されていないからです。もし、アニメーションをすぐに始めたい場合、interactionを要求することなしに、Windowにフォーカスされた時に呼ばれるonWindowFocusChanged()から呼ぶことが出来ます。

XMLを使用しないサンプルプログラム

XMLファイルを使用しないサンプルプログラムは以下の通りです。Activityの中のみでアニメーションを指定することが出来ます。ここでは3フレームを使った250msごとにフレームが変化するアニメーションを説明しています。

public class DrawableAnimation extends Activity{
 
 AnimationDrawable mAnimationDrawable;
 
 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
     setContentView(R.layout.drawable_animation);
     //Drawable Animation: Changing Images ----------------------------------------------
     //Create AnimationDrawable
     mAnimationDrawable = new AnimationDrawable();
     //Set frames
     Drawable[] mFrame = new Drawable[3];
     mFrame[0] = getResources().getDrawable( R.drawable.img1);
     mFrame[1] = getResources().getDrawable( R.drawable.img2);
     mFrame[2] = getResources().getDrawable( R.drawable.img3);
    
     //Add frames to AnimationDrawable
     for(int i = 0; i < mFrame.length; i++){
      mAnimationDrawable.addFrame( mFrame[i],  250);
     }
     ImageView imageView = (ImageView) findViewById(R.id.imageView1);
     //Set the animation to background drawable
     imageView.setBackground(mAnimationDrawable);
     //Animation starts
     imageView.post(new Runnable(){
         public void run(){
          mAnimationDrawable.setOneShot(false);
          mAnimationDrawable.start();
        
         }
     });          
 }

まず最初に11行目でAnimationDrawableのコンストラクタをセットしています。
13行目では、フレームにDrawableリソースをセットします。各画像は、res/drawableの中に置きます。ここでは3フレームのアニメーションを行っています。
20行目では、各フレームをAnimationDrawableにセットしています。ここでのパラメータは以下の通りです。
addFrame(Drawable frame, int duration)
  • Drawable frame: フレームとしてのDrawableリソース(画像)
  • int duration: このフレームの継続時間

24行目では、ImageViewの背景画像として、アニメーションをセットしています。
onCreate()の中では、まだリソースがセットされていないので、直接onCreate()の中でアニメーションを始めることはできません。そこで、26行目のようにImageView.postを使用します。これは、ImageViewに背景画像がセットされたら呼ばれるので、ここで、AnimationDrawable.start()を指定します。

2013年11月27日水曜日

[Androidアニメーション] 4. View Animation

AndroidのAPIににおける2Dアニメーションの種類は主に3種類あります。

Property Animation

Android3.0(API level 11)からサポートされ、どんなオブジェクトにもアニメーションを行うことができる
View Animation
Viewsに回転、移動、拡大縮小、透明度変換などのアニメーションが行える
Drawable Animation
パラパラ漫画のようにフレームを連続再生することができる

ここでは、Developer AndroidのView Animationの中身をかいつまんで、View Animationについて紹介します。

View Animationとは 

View Animationでは、View上にTween Animationを表示することが出来ます。Tween Animationはスタートポイント、エンドポイント、サイズ、回転や共通の縦横比などのアニメーション情報を計算します。

Tween AnimationはViewオブジェクトのコンテンツ上で、位置、サイズ、回転や透明度などの単純な変換を行うことが出来ます。例えば、TextViewオブジェクトにおいて、テキストの移動、回転、拡大縮小などができます。もし、TextViewに背景画像が設定してあれば、背景画像はテキストと一緒に変換されます。

アニメーションの手順はXMLかコードで書くことができます。ここではコードでのアニメーションの実行の仕方を紹介します。

View Animationはandroid.view.animation パッケージの中にあるクラスを使うことが出来ます。Viewに使えるアニメーションは4つあります。
  • Scale Animation: サイズの変更
  • Translate Animation: Viewの移動
  • Alpha Animation:透明度の設定
  • Rotate Animation:与えられた角度だけ回転
各アニメーションは、android.view.animationsの中にそれぞれクラスを持っています。すべてのアニメーションクラスは、抽象Animationクラスを拡張したものです。図1はこれらのクラスの階層を示しています。
図1ではAnimationSetというクラスがありますが、このクラスは、アニメーションのグループをつくることができ、同時にいくつかのアニメーションを行ったり、連続してアニメーションを行ったりする時などに使うことができます。
図1: View Animationのクラス階層

サンプルプログラム

サンプルプログラムでは、各アニメーションクラスの簡単な例をViewAnimationクラスとして書いています。それぞれのアニメーションにおいて、繰り返しモードsetRepeatMode()の設定で、逆戻りAnimation.REVERSEを指定しています。


public class ViewAnimation extends Activity {

 ImageView setImageView;
 AnimationSet animationSet;
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.view_animation);
     
        //Scale Animation Sample---------------------------------------------------
  ImageView scaleImageView = (ImageView) findViewById(R.id.imageView1);
  ScaleAnimation scaleAnimation = new ScaleAnimation(1.0f, 0.5f, 1.0f, 0.5f, 0, 0);
  scaleAnimation.setStartOffset(1000);
  scaleAnimation.setDuration(2000);
  scaleAnimation.setRepeatCount(Animation.INFINITE);
  scaleAnimation.setRepeatMode(Animation.REVERSE);
  scaleImageView.startAnimation(scaleAnimation);
  
  //Translate Animation Sample----------------------------------------------
  ImageView transImageView = (ImageView) findViewById(R.id.imageView2);
  TranslateAnimation transAnimation = new TranslateAnimation(0, 50, 0, 20);
  transAnimation.setDuration(3000);
  transAnimation.setRepeatCount(Animation.INFINITE);
  transAnimation.setRepeatMode(Animation.REVERSE);
  transImageView.startAnimation(transAnimation);
  
  //Alpha Animation Sample-------------------------------------------------
  ImageView alphaImageView = (ImageView) findViewById(R.id.imageView3);
  AlphaAnimation alphaAnimation = new AlphaAnimation(1.0f, 0.0f);
  alphaAnimation.setDuration(3000);
  alphaAnimation.setRepeatCount(Animation.INFINITE);
  alphaAnimation.setRepeatMode(Animation.REVERSE);
  alphaImageView.startAnimation(alphaAnimation);
  
  //Set Animation Sample---------------------------------------------------
  setImageView = (ImageView) findViewById(R.id.imageView5);
  animationSet = new AnimationSet(false);
  //Animation1
  ScaleAnimation scaleAnimation1 = new ScaleAnimation(0.5f, 1.0f, 0.5f, 1.0f);
  scaleAnimation1.setDuration(3000);
  //Animation2
  AlphaAnimation alphaAnimation1 = new AlphaAnimation(0.0f, 1.0f);
  alphaAnimation1.setDuration(3000);
  
  animationSet.addAnimation(scaleAnimation1);
  animationSet.addAnimation(alphaAnimation1);
  setImageView.startAnimation(animationSet);
  
  //AnimationListener
  animationSet.setAnimationListener(new Animation.AnimationListener() {  
        
        public void onAnimationStart(Animation animation) { 
        
        }  
        
        public void onAnimationRepeat(Animation animation) {
      
        }  
        
        public void onAnimationEnd(Animation animation) {  
         setImageView.startAnimation(animationSet);
        }  
      }); 
 
 }
 
 @Override
  public void onWindowFocusChanged(boolean hasFocus) {
   super.onWindowFocusChanged(hasFocus);
   //Rotate Animation Sample ---------------------------------------------------
   ImageView rotateImageView = (ImageView) findViewById(R.id.imageView4);
  int centerX = (int)rotateImageView.getWidth()/2;
  int centerY = (int)rotateImageView.getHeight()/2;
  RotateAnimation rotateAnimation = new RotateAnimation(0, 20, centerX,centerY);
  rotateAnimation.setDuration(3000);
  rotateAnimation.setRepeatCount(Animation.INFINITE);
  rotateAnimation.setRepeatMode(Animation.REVERSE);
  rotateImageView.startAnimation(rotateAnimation);
  }
}

アニメーションの設定

アニメーションの設定は、どのクラスでも同じような設定を行うことが出来ます。例としてScaleAnimationを上げて説明します。
ImageView scaleImageView = (ImageView) findViewById(R.id.imageView1);
ScaleAnimation scaleAnimation = new ScaleAnimation(0.5f, 1.0f, 0.5f, 1.0f, 0, 0);
scaleAnimation.setStartOffset(1000);
scaleAnimation.setDuration(3000);
scaleAnimation.setRepeatCount(Animation.INFINITE);
scaleAnimation.setRepeatMode(Animation.REVERSE);
scaleImageView.startAnimation(scaleAnimation);

13行目でアニメーションのコンストラクタを指定します。14行目の遅延時間setStartOffset(ms)、15行目のアニメーションの継続時間setDuration(ms)、16行目の繰り返し情報setRepeatCount()、17行目の繰り返しモードsetRepeatMode()などを指定して、最後に18行目のようにアニメーションを行いたいViewのstartAnimation()にアニメーションをセットすることで、アニメーションが始まります。
setRepeatCountにAnimation.INFINITEを指定すると無限にアニメーションを繰り返します。setRepeatMode()では、単純な繰り返しAnimation.RESTARTか逆戻りAnimation.REVERSEを設定することが出来ます。


Scale Animation

拡大縮小を行うには、ScaleAnimationを使用します。13行目のScaleAnimationのコンストラクタのパラメータは以下の通りです。サンプルプログラムでは、0.5倍から1倍に拡大しています。
ScaleAnimation(float fromX, float toX, float fromY, float toY, float pivotX, float pivotY);
  • float fromX: アニメーション開始のXスケール
  • float toX: アニメーション終了のXスケール
  • float fromY: アニメーション開始のYスケール
  • float toY: アニメーション終了のYスケール
  • float pivotX 原点となるX座標位置
  • float pivotY 原点となるY座標位置


Translate Animation

移動を行うには、TranslateAnimationを使用します。22行目のTranslateAnimationのコンストラクタのパラメータは以下の通りです。サンプルプログラムでは、元の位置(0, 0)からX座標に50ピクセル、Y座標に20ピクセル移動するアニメーションを指定しています。
TranslateAnimation(float fromXDelta, float toXDelta, float fromYDelta, float toYDelta);
  • float fromXDelta: アニメーション開始時のView内のX座標
  • float toXDelta: アニメーション終了時のView内のX座標
  • float fromYDelta: アニメーション開始時のView内のY座標
  • float toYDelta: アニメーション終了時のView内のY座標


Alpha Animation

透明度変化には、AlphaAnimationを使用します。30行目のAlphaAnimationのコンストラクタのパラメータは以下の通りです。サンプルプログラムでは、不透明から透明へ変化しています。ここでのパラメータの値は、0.0〜1.0を指定します。0.0は完全に透明、1.0は完全に不透明を示します。
AlphaAnimation (float fromAlpha, float toAlpha);
  • float fromAlpha: アニメーション開始時の透明度を指定
  • float toAlpha: アニメーション終了時の透明度を指定


Rotate Animation

回転には、RotateAnimationを使用します。75行目のRorateAnimationのコンストラクタのパラメータは以下の通りです。サンプルプログラムでは、20度の回転を指定しています。回転の中心座標をViewの中心に指定しています。
RotateAnimation(float fromDegrees, float toDegrees, float pivotX, float pivotY);
  • float fromDegrees: アニメーション開始時の回転角度
  • float toDegrees: アニメーション終了時の回転角度
  • float pivotX:回転の中心X座標
  • float pivotY: 回転の中心Y座標
サンプルプログラムでは、RotateAnimationをOnWindowFocusChangedの中で指定しています。これは、OnCreate内では早過ぎてViewのgetWidth(), getHeight()の値を取ることができず0が帰ってきてしまうからです。OnWindowFocusChanged内で呼ぶことで、値を得ることが出来ます。


Animation Set

複数のアニメーションを同時に行う場合には、AnimationSetを使用します。サンプルプログラムでは、scaleAnimation1とAlphaAnimation1のアニメーションをセットしています。AnimationSetでは、setRepeatCountが効きません。繰り返しを行いたい場合は、AnimationListenerを使用して、アニメーションの終了時にアニメーションの開始を指定することができます。
AnimationSet(boolean shareInterpolator);
  • boolean shareInterpolator: Interpolatorを共有するかどうかを指定


AnimationListener

51行目のAnimationListenerでは、アニメーションの開始、リピート、終了を監視することができます。ただし、AnimationSetではonAnimationRepeatは動作しません。

2013年11月16日土曜日

[Androidアニメーション] 3. Property Animation のプログラム

Android APIには2DAnimationが3種類用意されています。Property Animation, View Animation,Drawable Animationです。これらの違いの説明は1. Android Animationの種類紹介しています。
ここでは主にObject Animatorを使ったProperty Animationのサンプルプログラムを紹介します。Property Aniamtionの詳細な説明は2. Property Animationの説明で紹介しています。

  1. Android Animationの種類
  2. Property Animationの説明
  3. Property Animationのプログラム
  4. View Animation の説明とプログラム
  5. Drawable Animationの説明とプログラム


Property Animationのサンプルプログラム

サンプルではオブジェクトをButton 1とButton2とし、プロパティをButton 1ではテキストカラー、Button 2ではx方向の移動距離とするアニメーションを行っています。



public class SamplePropertyAnimation extends Activity {
 
 private static final int RED = 0xffFF8080;
 private static final int BLUE = 0xff8080FF;
 Button button1;
 Button button2;
 
 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  
  setContentView(R.layout.propertyanimation_main);
  
  //Property Animation: Changing TextColor
  button1 = (Button) findViewById(R.id.btn1);
  ObjectAnimator colorAnimator = ObjectAnimator.ofInt(button1,"textColor", RED, BLUE);
  colorAnimator.setDuration(3000);
  colorAnimator.setEvaluator(new ArgbEvaluator());
  colorAnimator.setRepeatCount(ValueAnimator.INFINITE);
  colorAnimator.setRepeatMode(ValueAnimator.REVERSE);
  colorAnimator.start();
     
  //Property Animation: Translation
  button2 = (Button) findViewById(R.id.btn2);
  ObjectAnimator transAnimator = ObjectAnimator.ofFloat(button2, "x", 0f, 100f);
  transAnimator.setDuration(5000);
  transAnimator.setRepeatCount(2);
  transAnimator.setInterpolator(new BounceInterpolator());
  transAnimator.addListener(new AnimatorListenerAdapter(){
   @Override
   public void onAnimationEnd(Animator animation){
    //Write processing after animating
    button2.setVisibility(View.GONE);
   } 
  });
  transAnimator.start();
  
 }

}
16行目でObjectAnimatorにアニメーションしたいオブジェクトとプロパティを設定します。
ObjectAnimator colorAnimator = ObjectAnimator.ofInt(button1,"textColor", RED, BLUE);
1.ターゲットとなるオブジェクト:ここではButtonを設定。
2.プロパティの名前(String):ここでは"textColor"を設定。
3.開始のプロパティの値
4.終了時のプロパティの値
17行目でアニメーションの継続時間をmsで設定します。デフォルトでは300msが設定されています。 

18行目でEvaluatorを設定します。Evaluatorsは与えられたプロパティ値をどのように計算するか指定します。ここでは色の変化をアニメーションするので、ArgbEvaluator()を設定しています。Evaluatorの種類は以下の通りです。
  • IntEvaluator: int プロパティの値を計算。
  • FloatEvaluator:  floatプロパティの値を計算。
  • ArgbEvaluator:  16進数で表されるカラープロパティの値を計算。
  • TypeEvaluator: カスタマイズのエバリュエータを作ることが出来るインターフェース。もし、int, float, colorではないオブジェクトプロパティにアニメーションをしたい場合、オブジェクトプロパティの値をどのように計算をするか指定することができます。

21行目でアニメーションをスタートします。

28行目ではアニメーションの速度を示すInterpolatorを設定しています。Interpolatorはアニメーションで指定された値がタイム機能としてどのように計算されるか定義することができます。例えば、全体のアニメーションを通して、連続的に起こるアニメーションを指定するか、またはアニメーションの始まりと終わりで加速するようなの不連続的なアニメーションを指定するかなど選択できます。android.view.animationに含まれるInterpolatorは以下の種類があります。
  • AccelerateDecelerateinterpolator: 最初最後がゆっくりになり、真ん中で加速する。 
  • AccelerateInterpolator: ゆっくりで始まり、徐々に加速して行く。 
  • AnticipateInterpolator: 開始時に逆方向にためる。 
  • AnticipateOvershootInterpolator:  開始時に逆方向にため、終了時にはみ出す。 
  • BounceInterpolator: 終了時にバウンドする。 
  • AnticipateOvershootInterpolator: 開始時に逆方向にため、終了時にはみ出す。 
  • CycleInterpolator: 指定された回数アニメーションを繰り返す。 
  • DecelerateInterpolator: 開始時に素早く徐々に速度を落とす。 
  • LinearInterpolator: 一定に変化させる。 
  • OvershootInterpolator: 終了時にはみ出す。
  • TimeInterpolator: カスタマー実装を行う。
29行目ではAnimationListenersを設定しています。これは、アニメーションが行われている間のイベントを監視することができます。例では、アニメーション終了時にボタンを消去しています。Listenersでは以下のイベントをキャッチすることができます。
  • onAnimationStart() アニメーション開始時に呼ばれる。
  • onAnimationEnd() アニメーション終了時に呼ばれる。
  • onAnimationRepeat() アニメーション繰り返し時に呼ばれる。
  • onAnimationCancel() キャンセル時に呼ばれる。このとき、onAnimationEnd()も同時に呼ばれる。


2013年11月15日金曜日

[Androidアニメーション] 2. Property Animationの説明

AndroidのAPIににおける2Dアニメーションの種類は主に3種類あります。

Property Animation
Android3.0(API level 11)からサポートされ、どんなオブジェクトにもアニメーションを行うことができる
View Animation
Viewsに回転、移動、拡大縮小、透明度変換などのアニメーションが行える
Drawable Animation
パラパラ漫画のようにフレームを連続再生することができる

ここでは、Developer AndroidのProperty Animationの中身をかいつまんで、Property Animationについて紹介します。サンプルプログラムについては、Property Animationのサンプルプログラムの説明で紹介しています。

Property Animationとは

Android3.0(API level 11)からサポートされ、Viewに限らず、どんなオブジェクトのプロパティにも指定した時間間隔で、アニメーションを行うことができます。ここでいうプロパティとはアニメーションに必要な設定値を指しています(例えば、色の変化値、透明度など)。このシステムは拡張性があり、カスタムタイプのプロパティにも適しています。Property Animationには以下のようなアニメーション機能を定義することができます。
継続時間(Duration): アニメーションの継続時間を指定することが出来ます。デフォルトは300msです。

補間時間(Time interpolation): アニメーションの現在の経過時間の機能として、プロパティの値がどのように計算されるか指定することが出来ます。
繰り返し(Repeat count and behavior): アニメーションの繰り返し回数や振る舞いなどを指定することが出来ます。

アニメーションのセット機能(Animator sets): 複数のアニメーションをグループ化して表示することができます。連続回数や、遅延などを指定することができます。
フレーム更新の遅延(Frame refresh delay): フレーム更新の時間を指定することが出来ます。デフォルトの設定は10msごとですが、アプリケーションのスピードに依存します。

Property Animationの動き

アニメーションがどのように行われるか簡単な例を紹介します。図1はプロパティxを持つオブジェクトを示しています。ここでプロパティxは画面のx方向への位置を表しているとします。アニメーションの継続時間を40msに設定し、移動距離を40pixelsとします。すると10 msごと、フレームが更新され10pixelsごとx方向にオブジェクトが移動します。この例では、補間時間の設定に、一定のスピードで物体が動くlinear interpolationを指定しています。

図1.Linear Interpolationの例

またスピードが変化するnon-linear interpolationも指定することが出来ます。図2はアニメーションの開始時に加速をし、中間からまた徐々に最後まで加速をするというアニメーションを示しています。オブジェクトは40msに40pixels移動しますが、速度が変化しています。


図2.non-linear Interpolationの例

Property Animationが上のようなアニメーションをどのように計算しているか説明していきます。図3はメインクラスと他のクラスの関係を示しています。


図3.アニメーションの計算の仕方

ValueAnimatorオブジェクトは継続時間やプロパティの現在の値などのアニメーションのタイミングを監視しています。ValueAnimatorはアニメーションの補間時間を定義しているTimeInterpolator、プロパティの値の計算方法を定義するTypeEvaluatorをカプセル化しています。例えば、図2ではTimeInterpolatorはAccelerateDecelerateInterpolatorをTypeEvaluatorにはIntEvaluatorが設定されています。

アニメーションを開始するには、ValueAnimatorを作り、アニメーションしたいプロパティの最初と最後の値を設定します。start()を呼ぶとアニメーションが始まります。アニメーションの間、ValueAnimatorはアニメーションの継続時間とどれくらい経過したかで、0から1の間でその割合を計算します。経過割合はアニメーションがどれくらい経過したかを0が0%を1が100%で示しています。例えば図1では、t=10での経過割合は全体の時間が40msなので、0.25になります。

ValueAnimatorが経過割合を計算しているとき、補間割合を計算するために、現在セットされているTimeInterpolatorが呼ばれます。補間割合はセットされた時間補間を考慮して新しい割合を時間補間にセットします。例えば図2でじゃ、アニメーションはゆっくり加速するので、t=10のとき、時間補間よりも小さい補間割合0.15となります。図1では補間割合は時間補間と同じように一定となります。

補間割合が計算されるときValueAnimatorはアニメーションの補間割合、始まりの値、終わりの値をもとに、プロパティの値を計算するために、適切なTypeEvaluatorを呼びます。例えば図2では補間割り肺はt=10msの時に0.15なので、この時間でのプロパティ値は0.15x(40 - 0)=6となります。

Property AnimationとView Animationの違いView AnimationシステムはViewオブジェクトにのみアニメーションを行うことが出来ます。もし、Viewオブジェクト以外にアニメーションを行いたい場合は、自信のコードを実行しなければいけません.View Animation システムは背景色の変更などはできず、Viewの回転や拡大縮小などアニメーションが限られています。さらにView Animationのデメリットは、実際のViewではなく表示されたViewのみを修正します。例えば、スクリーン上にボタンが動くアニメーションを行った場合、現在ある位置でボタンをクリックしても反応しません。自信でこれを修正する必要があります。

Property Animation システムはこれらの制約が取り除かれ、どんなオブジェクトのどんなプロパティにもアニメーションを行うことができ、オブジェクト自身も修正されます。Property Animationシステムはまたアニメーション実行においてさらにロバストになっています。ハイレベルで、animatorにアニメーションをしたいプロパティ(例えば色、位置やサイズなど)を指定をして複数のanimatorの同期や補間などのアニメーションのアスペクトを定義することができます。

View Animationシステムは短いセットアップ時間と少ないコードで設定できます。もしView Animationで自信のアニメーションが行えるのであればProperty Animationを使う必要はありません。異なった状況において両方のアニメーションシステムを使うことも可能です。

APIの概要

Property AnimationシステムのAPIはandroid.animationで定義されています。View Animationシステムではandroid.view.animationの中で、多くの補間機能が既に定義されていますが、Property Animationシステムでも同じようにこれらの機能を使うことが出来ます。以下では、Property Animationシステムの主な構成要素を示しています。

Animator クラスはアニメーションを構成する上で基本的なメソッドを定義したスーパークラスです。Animatorクラスは抽象クラスと定義されているため、直接インスタンス化することは出来ないので、通常Animatorクラスのサブクラスを使用します。サブクラスは主に3つ、ValueAnimator, ObjectAnimator, AnimatorSetがあります。主に、オブジェクトの属性などを設定するのには、ObjectAnimatorクラスを使います。

ValueAnimator

ValueAnimatorは、Property Animationのメインとなるタイミングエンジンです。プロパティ値を計算し、各アニメーションの詳細、繰り返し情報やイベントのアップデートを受け取るリスナーを含んでいます。アニメーションは、主に2つの部分に分けられます。アニメーション値の計算とアニメーションされるオブジェクトとプロパティにそれらの値を設定することです。ValueAnimatorでは、オブジェクトとプロパティに値を設定することができないので、自信のロジックでアニメーションをしたいオブジェクトに値をアップデートしていく必要があります。

ObjectAnimator

ValueAnimationのサブクラスで、ターゲットオブジェクトを設定することが出来ます。このクラスはアニメーションの値を計算する時に,それに応じてプロパティををアップデートします。ターゲットとなるオブジェクトにアニメーション値を設定できるので、簡単にアニメーションを行うことが出来ます。しかし、OjbectAnimationは現在のターゲットオブジェクトに特定のアクセッサーの方法を要求する場合に制限出てくるので、その時にはValueAnimationを直接使います。

AnimationSet

アニメーションをグループ化することができます。アニメーションの同時表示や連続表示、また指定した遅延時間後などを設定することが出来ます。

[Androidアニメーション] 1. アニメーションの種類

Androidフレームワークには、Android 3.0からサポートされているProperty Animationと従来からサポートされているView Animationがあります。Property AnimationはView Animationよりも柔軟性が高く多くの機能を持っているので、使いやすいと言えます。これらの2つのシステムに加えてDrawable Animationがあります。Drawable Animationではリソースをロードし、ぱらぱら漫画のように、連続したフレームで画像を表示することが出来ます。

Property Animation

Android3.0(API level 11)からサポートされ、Viewsに限らず、どんなオブジェクトのプロパティにも指定した時間間隔で、アニメーションを行うことができます。ここでいうプロパティとはアニメーションに必要な設定値を指しています(例えば、色の変化値、透明度など)。このシステムは拡張性があり、カスタムタイプのプロパティにも適しています。
サンプルプログラムの説明

View Animation

View Animationは、従来のシステムで、Viewsにのみアニメーションを行うことが出来ます。設定が簡単で、Viewsの移動、拡大縮小、透過度の変化など、基本的な機能を備えています。
サンプルプログラムの説明

Drawable Animation

Drawable Animationは、Drawable リソースを次から次へと表示することが出来きます。パラパラ漫画のような連続的なアニメーションを行うことが出来ます。
サンプルプログラムの説明




サンプルプログラムは、各アニメーションを最も簡単な例で示しています。詳細は各アニメーションの紹介ページ(Property Animation, View Animation, Drawable Animation)で説明しています。参考にしてください。


public class SampleAnimation extends Activity {
 
 private static final int RED = 0xffFF8080;
 private static final int BLUE = 0xff8080FF;
 
 AnimationDrawable mAnimationDrawable;
 
 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  
  setContentView(R.layout.activity_main);
  
  //Property Animation: Changing TextColor-------------------------------------
  Button btnColor = (Button) findViewById(R.id.btncolor);
  //Define an object and property in ObjectAnimator 
  ObjectAnimator animColor = ObjectAnimator.ofInt(btnColor,"textColor", RED, BLUE);
  //Set duration time (ms)
  animColor.setDuration(3000);
  //Set Evaluator, how to calculate the specified values.
  animColor.setEvaluator(new ArgbEvaluator());
  //Set repeat count
  animColor.setRepeatCount(ValueAnimator.INFINITE);
  //Set repeat mode
  animColor.setRepeatMode(ValueAnimator.REVERSE);
  //Animation starts
  animColor.start();
  
  //View Animation: Changing Transparency--------------------------------------
  Button btnAlpha = (Button) findViewById(R.id.btnalpa);
  //Set a value of transparency
  AlphaAnimation alp1 = new AlphaAnimation(1.0f, 0.0f);
  //Set duration time (ms)
  alp1.setDuration(3000);
  //Set repeat count
  alp1.setRepeatCount(Animation.INFINITE);
  //Animation starts
  btnAlpha.startAnimation(alp1);
     
  //Drawable Animation: Changing Images ----------------------------------------------
  //Create AnimationDrawable
  mAnimationDrawable = new AnimationDrawable();
  //Set frames
  Drawable[] mFrame = new Drawable[2];
  mFrame[0] = getResources().getDrawable( R.drawable.imgcat1);
  mFrame[1] = getResources().getDrawable( R.drawable.imgcat2);
  //Add frames to AnimationDrawable
  for(int i = 0; i < mFrame.length; i++){
   mAnimationDrawable.addFrame( mFrame[i],  200);
  }
  ImageView imageView = (ImageView) findViewById(R.id.image);
  //Set the animation to background drawable
  imageView.setBackgroundDrawable(mAnimationDrawable);
  //Animation starts
  imageView.post(new Runnable(){
      public void run(){
       mAnimationDrawable.setOneShot(false);
    mAnimationDrawable.start();
    
      }
  });
  
 }

}