| page.title=Drawable Animation |
| parent.title=Animation |
| parent.link=animation.html |
| @jd:body |
| |
| <p>Drawable animation lets you load a series of Drawable resources one after |
| another to create an animation. This is a traditional animation in the sense that it is created with a sequence of different |
| images, played in order, like a roll of film. The {@link |
| android.graphics.drawable.AnimationDrawable} class is the basis for Drawable animations.</p> |
| |
| <p>While you can define the frames of an animation in your code, using the {@link |
| android.graphics.drawable.AnimationDrawable} class API, it's more simply accomplished with a |
| single XML file that lists the frames that compose the animation. The XML file for this kind |
| of animation belongs in the <code>res/drawable/</code> directory of |
| your Android project. In this case, the instructions are the order and duration for each frame of |
| the animation.</p> |
| |
| <p>The XML file consists of an <code><animation-list></code> element as the root node and a |
| series of child <code><item></code> nodes that each define a frame: a drawable resource for |
| the frame and the frame duration. Here's an example XML file for a Drawable animation:</p> |
| <pre> |
| <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> |
| </pre> |
| |
| <p>This animation runs for just three frames. By setting the <code>android:oneshot</code> |
| attribute of the list to <var>true</var>, it will cycle just once then stop and hold on the last |
| frame. If it is set <var>false</var> then the animation will loop. With this XML saved as |
| <code>rocket_thrust.xml</code> in the <code>res/drawable/</code> directory of the project, it can |
| be added as the background image to a View and then called to play. Here's an example Activity, |
| in which the animation is added to an {@link android.widget.ImageView} and then animated when the |
| screen is touched:</p> |
| <pre> |
| 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); |
| } |
| </pre> |
| |
| <p>It's important to note that the <code>start()</code> method called on the AnimationDrawable |
| cannot be called during the <code>onCreate()</code> 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 <code>{@link |
| android.app.Activity#onWindowFocusChanged(boolean) onWindowFocusChanged()}</code> method in your |
| Activity, which will get called when Android brings your window into focus.</p> |
| |
| <p>For more information on the XML syntax, available tags and attributes, see <a href= |
| "{@docRoot}guide/topics/resources/animation-resource.html">Animation Resources</a>.</p> |