Home > Web Front-end > HTML Tutorial > Getting Started with Frame Animation Drawable Animation_html/css_WEB-ITnose

Getting Started with Frame Animation Drawable Animation_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 11:44:01
Original
1190 people have browsed it

Drawable Animation

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. TheAnimationDrawableclass is the basis for Drawable animations.

Drawable animation is a traditional method that loads a series of pictures one by one to create animations. Animation is actually a sequence of different images. AnimationDrawable is the base class of Drawable animations

While you can define the frames of an animation in your code, using theAnimationDrawableclass 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 res/drawable/ directory of your Android project. In this case, the instructions are the order and duration for each frame of the animation.

Although it is possible to define frame animations in code using the AnimationDrawable class, it is better to use an XML file to list all the frames that make up the animation. This xml file is placed in the res/drawable/ directory. In fact, all the instructions are the order and duration of each frame of animation

The XML file consists of an element as the root node and a series of child 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:

xml file consists of the root element and a series of sub-elements , where defines the image and duration corresponding to each frame, as follows:

<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>
Copy after login

This animation runs for just three frames. By setting the android:oneshot attribute of the list to true, it will cycle just once then stop and hold on the last frame. If it is set false then the animation will loop. With this XML saved as rocket_thrust. xml in the res/drawable/ 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 ImageView and then animated when the screen is touched:

The above example is a 3-frame animation. By setting android:oneshot to true, it will only loop once and stay at the last frame. above, if it is false, it will run in a loop

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);}
Copy after login

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

Note: The start() method cannot be called in the onCreate() method of your Activity, because the AnimationDrawable is not fully attached to the window at that time. If you must call the animation immediately, without interaction, you can call it in onWindowFocusChanged(). Because this method is called when the window gains focus


For more information on the XML syntax, available tags and attributes, see Animation Resources.

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template