FramebyFrame Animation in Android

Using framebyframe technique for animation in android

Today i will use frame by frame way of animation . Here i have a sequence of images which  will be use as frames and continuous rapid  change in these  frames cause the illusion which looks like an animation.

OK lets then start.
I create a new project called "Anime".
I got a collection of images which contains 33 images. You can also make such images using Photoshop or any other photo-editor applications.

My image collection which will be use for Frame animation

 Now i come to my resource directory in eclispe i.e. res folder.And i drag all my images in drawable folder.

Dragging images in drawable folder

Now i go to my XML file and change my layout from Linear Layout to Relative Layout.
 Here i need a imageview so i drag a imageview in my layout.

Dragging imageview in my layout

If gravity of imageview is not center then make it. In my case it is center by default.

Now i need to create a new animation file . So i create a new XML file called animation.xml.
If by default there is linear layout in this xml ,remove it .
i write this code in this xml:

  <?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android" 
android:oneshot="false" > //this oneshot is use for looping of animation

    <item
        android:drawable="@drawable/animation_00031"
        android:duration="30"/>
...................................................... //here i list other items as shown in figure
....................................................
</animation-list>

Adding images in xml for frameanimation

Now i need to apply these images in imageview and thats gonna be done in my java file.
And write this code inside oncreate function:

 final ImageView im = (ImageView) findViewById(R.id.imageView1);
im.setBackgroundResource(R.layout.animation);
im.setOnClickListener(new View.OnClickListener()// when i click the imageview button anmiations start
 {
@Override
public void onClick(View arg0) {
AnimationDrawable ad = (AnimationDrawable) im.getBackground();
ad.start();

}
});

Writing core code part in  java file for animatiom

While i run my project it appears like this:

View of my avd while running my project

The icons appears in front of my animation image .It is due to the source of imageview.  It can be remove from source in my xml file. After reomving it appears like this:

My frameAnimation