Android Frame-by-Frame animation

[in Englis]
Today I'll write the article about when I was in the trouble about Android Frame-by-Frame Animation using several png image files.

In the short, Frame-by-Frame animation is like a flipbook using picture files.

First, I tried to write animation codes referring to Android Developer Reference, but it didn't work.
so I looked into the cause of it, and then I studied that Frame-by-Frame animation must be started after onCreate/onResume is finished on Activity life cycle.
Translate or rotate animations can be started in onCreate/onResume, but Frame-by-Frame animation cannot be done.

How to start Frame-by-Frame animation is that starting it in onWindowFocusChanged.
(It is easy solution, so if I find the any other better solution I'll write blog about this)

I'll show the sample codes.

・main.xml

<framelayout id="@+id/FrameLayout01" android="http://schemas.android.com/apk/res/android" layout_width="wrap_content" layout_height="wrap_content">
 <imageview id="@+id/ImageView01" layout_height="wrap_content" layout_width="wrap_content" layout_gravity="top" background="@anim/frame_anim">
 </imageview>
</framelayout>

・frame_anim.xml

<animation-list id="animation_sample" android="http://schemas.android.com/apk/res/android" oneshot="false">
  <item duration="100" drawable="@drawable/anim01">
  <item duration="100" drawable="@drawable/anim02">
  <item duration="100" drawable="@drawable/anim03">
  <item duration="100" drawable="@drawable/anim04">
  <item duration="100" drawable="@drawable/anim05">
</animation-list>

・AnimActivity.java

package com.sample.frameanim;

import android.app.Activity;
import android.graphics.drawable.AnimationDrawable;
import android.os.Bundle;
import android.widget.ImageView;

public class AnimActivity extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
    }

    @Override
    public void onWindowFocusChanged(boolean hasFocus) {
        ImageView imageView1 = (ImageView) findViewById(R.id.ImageView01);
　　　　AnimationDrawable animation1 =
              (AnimationDrawable)imageView1.getBackground();
　　　　if (hasFocus) {
　　　　　　animation1.start();
　　　　} else {
　　　　　　animation1.stop();
　　　　}
　　}
}

---

[in Japanese]
pngファイルを複数使って、AndroidのFrame-by-Frameアニメーションをするサンプルアプリの作成で、はまったことを書きたいと思います。


Frame-by-Frameアニメーションとは、一言で言うと画像ファイルのパラパラ漫画です。(同一サイズの)複数の画像ファイルを次々と変えることでアニメーションを実現します。

先ず、Android Developer Referenceを参照して作ったのですが、全くアニメーション動作が開始されませんでした。
色々調べたところ、Frame-by-Frameアニメーションは、Activityのライフサイクルの中で、onCreate/onResumeが完了した後に実施する必要があるようです。
手っ取り早く動作を見たくて、他のtranslateやrotateのアニメーション同様に、onCreateの中でアニメーションをスタートしたのが原因でした。

取り急ぎの解決方法として
onWindowFocusChangedメソッド内で実行することです。
(他にも方法があれば追記していきたいと思います。)

下記は、onWindowFocusChangedメソッドを使って、Frame-by-Frameアニメーションを実現させたコードです。

・main.xml

<framelayout id="@+id/FrameLayout01" android="http://schemas.android.com/apk/res/android" layout_width="wrap_content" layout_height="wrap_content">
 <imageview id="@+id/ImageView01" layout_height="wrap_content" layout_width="wrap_content" layout_gravity="top" background="@anim/frame_anim">
 </imageview>
</framelayout>

・frame_anim.xml

<animation-list id="animation_sample" android="http://schemas.android.com/apk/res/android" oneshot="false">
  <item duration="100" drawable="@drawable/anim01">
  <item duration="100" drawable="@drawable/anim02">
  <item duration="100" drawable="@drawable/anim03">
  <item duration="100" drawable="@drawable/anim04">
  <item duration="100" drawable="@drawable/anim05">
</animation-list>

・AnimActivity.java

package com.sample.frameanim;

import android.app.Activity;
import android.graphics.drawable.AnimationDrawable;
import android.os.Bundle;
import android.widget.ImageView;

public class AnimActivity extends Activity {
    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
    }

    @Override
    public void onWindowFocusChanged(boolean hasFocus) {
        ImageView imageView1 = (ImageView) findViewById(R.id.ImageView01);
　　　　AnimationDrawable animation1 =
              (AnimationDrawable)imageView1.getBackground();
　　　　if (hasFocus) {
　　　　　　animation1.start();
　　　　} else {
　　　　　　animation1.stop();
　　　　}
　　}
}