アニメーション入門

はじめに

下記ページの Animation について読んだときの簡易メモです。
http://developer.android.com/guide/topics/graphics/overview.html

アニメーションの種類、View Animation と Property Animation の違い、オフィシャルドキュメントのリンクあたりは知っておいて損はないと思います。

Property Animation については、View Animation との違いを書くに留めていますので、その点ご了承ください。

アニメーションの種類

View Animation

• API level 11 以前から使える
• セットアップが簡単
• 複雑なアニメーション要求がなければ、大抵はこれで対応できる

Property Animation

• API level 11 以降で使える
• View 以外のオブジェクトにも適用できる

Drawable Animation

• gif のようなアニメーション

View Animation

• アニメーションの対象は View のみ
• 位置、サイズ、角度、透明度といった値を変化させることができる
• アニメーション内容は xml または コードで定義する
• readable, reusable, swappable なため xml で定義するほうが推奨される
• コードで定義する場合は、下記リンクを参考
  • http://developer.android.com/reference/android/view/animation/AnimationSet.html
  • http://developer.android.com/reference/android/view/animation/Animation.html
• xml は res/anim 配下に格納する
• xml はひとつのルート（下記項目）から構成される
  • alpha
  • scale
  • translate
  • rotate
  • interpolator
  • set
• set は上記項目を子にもつ（set 内に set を持つことも可）
• デフォルトでは、アニメーションはすべて同時に適用される
  • 連続的にアニメーションを発生させたい場合は startOffset を指定する

xml サンプル

700ms かけて拡大し、その後、700ms かけて回転しながら縮小するサンプルです。

attributes の詳細は下記リンクを参照。
http://developer.android.com/guide/topics/resources/animation-resource.html#Tween

sample.xml

<set android:shareInterpolator="false">
    <scale
        android:interpolator="@android:anim/accelerate_decelerate_interpolator"
        android:fromXScale="1.0"
        android:toXScale="1.4"
        android:fromYScale="1.0"
        android:toYScale="0.6"
        android:pivotX="50%"
        android:pivotY="50%"
        android:fillAfter="false"
        android:duration="700" />
    <set android:interpolator="@android:anim/decelerate_interpolator">
        <scale
           android:fromXScale="1.4"
           android:toXScale="0.0"
           android:fromYScale="0.6"
           android:toYScale="0.0"
           android:pivotX="50%"
           android:pivotY="50%"
           android:startOffset="700"
           android:duration="400"
           android:fillBefore="false" />
        <rotate
           android:fromDegrees="0"
           android:toDegrees="-45"
           android:toYScale="0.0"
           android:pivotX="50%"
           android:pivotY="50%"
           android:startOffset="700"
           android:duration="400" />
    </set>
</set>

コードサンプル

• 下記方法のほか、Animation.setStartTime() 後に View.setAnimation() してもOK

SampleActivity.java

ImageView imageView = (ImageView) findViewById(R.id.image);
Animation animation = AnimationUtils.loadAnimation(this, R.anim.sample);
imageView.startAnimation(animation);

Property Animation

View Animation と Property Animation の違い

• View Animation は View オブジェクトに適用できるが、non-View オブジェクトには適用できない
• View Animation には、View の拡大・縮小・回転などはできるが、バックグラウンドカラーを変化させることはできないといった制限がある
• View Animation は View の'描画'内容に対してのみ適用されるものであり、実際のオブジェクトに対してその効果が適用されているわけではない（例えば左上にあるボタンを中央に移動させたとしても、移動しているのは描画内容だけであり、実際のボタンは移動していないため、クリックは元の位置（左上）でしか行えない）
• Property Animation では、上記制約はすべてなく、どんなオブジェクトのどんなプロパティに対しても適用できる
• View Animation のほうが、セットアップ時間が少なく、コード量も少なく書けるため、View Animation で十分表現できるものであれば Property Animation を使う必要はない

Drawable Animation

• 一連の Drawable resources を次々に表示させるアニメーション
• アニメーションを構成するフレームのリストは、コードでも定義できるが xml で作るほうがシンプルで簡単
• xml は res/drawable/ に格納する
• xml ではフレームの表示時間と順番を指定する
• xml のルートは animation-list、子に item をもつ
• android:oneshot アトリビュートはデフォルト（＝指定なし）で false
• android:oneshot を true とするとリピートしない

xml サンプル

attributes の詳細は下記リンクを参照。
http://developer.android.com/guide/topics/resources/animation-resource.html#Frame

sample.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>

コードサンプル

AnimationDrawable#start() は呼び出しタイミングに注意が必要。理由は下記のとおり。

It's important to note that the start() method called on the AnimationDrawable cannot be called during the onCreate() method of your Activity, because the AnimationDrawable is not yet fully attached to the window. If you want to play the animation immediately, without requiring interaction, then you might want to call it from the onWindowFocusChanged() method in your Activity, which will get called when Android brings your window into focus.

SampleActivity.java

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.sample);
  rocketAnimation = (AnimationDrawable) rocketImage.getBackground();
}

public boolean onTouchEvent(MotionEvent event) {
  if (event.getAction() == MotionEvent.ACTION_DOWN) {
    rocketAnimation.start();
    return true;
  }
  return super.onTouchEvent(event);
}