Android Study Notes: draw an animation Summary based on the series of images

1. Use the system-provided animation class and built-in Methods

The animation. xml file is as follows:

<animation-list xmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="false">  <item android:drawable="@drawable/a" android:duration="100" />   <item android:drawable="@drawable/b" android:duration="100" />   <item android:drawable="@drawable/c" android:duration="100" />   <item android:drawable="@drawable/d" android:duration="100" />   <item android:drawable="@drawable/e" android:duration="100" />   <item android:drawable="@drawable/f" android:duration="100" />   <item android:drawable="@drawable/g" android:duration="100" />   <item android:drawable="@drawable/h" android:duration="100" />   <item android:drawable="@drawable/i" android:duration="100" />   <item android:drawable="@drawable/j" android:duration="100" />   </animation-list>

 

Animationdrawable = NULL;/** get the imageview object **/imageview = (imageview) findviewbyid (R. id. imageview);/** obtain the animationdrawable of the background display through the imageview object **/animationdrawable = (animationdrawable) imageview. getbackground ();/** start playing the animation **/button0 = (button) findviewbyid (R. id. button0); button0.setonclicklistener (New onclicklistener () {@ override public void onclick (view arg0) {/** playback animation **/If (! Animationdrawable. isrunning () {animationdrawable. Start ();}}});

Specifically: // sets the animation drawable. setoneshot (true) for a single playback );

2. provides a lot of Frame Animation images. using Android graphics, you can draw animations for moving people.

 

For example, in this case, you can follow the steps below to draw an animation:

1. A four-part animation array can be defined based on the movement of a character between the top, bottom, left, and right;

2. Different animations are triggered Based on the keyboard press events.

 

The statement for drawing is as follows:

mHeroAnim[ANIM_DOWN] = new Animation(context,new int []{R.drawable.hero_down_a,R.drawable.hero_down_b,R.drawable.hero_down_c,R.drawable.hero_down_d},true);    mHeroAnim[ANIM_LEFT] = new Animation(context,new int []{R.drawable.hero_left_a,R.drawable.hero_left_b,R.drawable.hero_left_c,R.drawable.hero_left_d},true);    mHeroAnim[ANIM_RIGHT]= new Animation(context,new int []{R.drawable.hero_right_a,R.drawable.hero_right_b,R.drawable.hero_right_c,R.drawable.hero_right_d},true);    mHeroAnim[ANIM_UP]   = new Animation(context,new int []{R.drawable.hero_up_a,R.drawable.hero_up_b,R.drawable.hero_up_c,R.drawable.hero_up_d},true);

 

3. To provide only one character image, you must use a program to cut the image and obtain the frame image required by the animation,

For example, in this case, you can follow the steps below to draw an animation:

1. The width and height of the image, and the defined width and height of the tile can be used to cut out 12 required frames;

2. Based on the actions of a character on the upper, lower, and left sides, the animation can be divided into four sections and an animation array with a length of 4 can be defined;

3. Different animations are triggered Based on the keyboard down and down key events;

The main code for cutting an image and drawing an animation is as follows:

// Use a program to cut the image bitmap testmap = readbitmap (context, R. drawable. enemy); bitmap [] [] bitmap = new bitmap [anim_count] [anim_count]; int tilewidth = testmap. getwidth ()/anim_count; int tileheight = testmap. getheight ()/anim_count; int I = 0, x = 0, y = 0; for (I = 0; I <anim_count; I ++) {Y = 0; bitmap [anim_down] [I] = bitmapclipbitmap (testmap, X, Y, tilewidth, tileheight); y + = tileheight; bitmap [anim_left] [I] = bitmapclipbitmap (testmap, X, y, tilewidth, tileheight); y + = tileheight; bitmap [anim_right] [I] = bitmapclipbitmap (testmap, X, Y, tilewidth, tileheight); y + = tileheight; bitmap [anim_up] [I] = bitmapclipbitmap (testmap, X, Y, tilewidth, tileheight); X ++ = tilewidth;} mtestanim [anim_down] = new animation (context, context, bitmap [anim_down], true); mtestanim [anim_left] = new animation (context, bitmap [anim_left], true); mtestanim [anim_right] = new animation (context, bitmap [anim_right], true); mtestanim [anim_up] = new animation (context, bitmap [anim_up], true );

 

Note: The above two methods use different painting methods respectively.

The method for constructing the first method is animation (context, int [] framebitmapid, Boolean isloop );

 

The second method of drawing construction is: animation (context, bitmap [] framebitmap, Boolean isloop );

 

With these preparation conditions, we can start to actually draw:

Public void drawanimation (canvas, paint, int X, int y) {// continue playing if (! Misend) {canvas. drawbitmap (mframebitmap [mplayid], X, Y, paint); long time = system. currenttimemillis (); If (time-mlastplaytime> anim_time) {mplayid ++; mlastplaytime = time; If (mplayid> = mframecount) {// indicates that the animation playback ends misend = true; if (misloop) {// set loop playback misend = false; mplayid = 0 ;}}}}}

 

Here, two flags are used to determine the animation status, misend determines whether the animation is played, true indicates that the playback ends, false indicates that the animation is played, misloop indicates whether the animation is loop, and true indicates that the animation is loop, false indicates no loop. Of course, when an animation is loop, the animation must be played. If misloop is set to true, misend is set to false. Because each group of animations contains four images, therefore, the maximum number of mplayids is 4. When a group of actions of a character, that is, an animation, indicates that all four images have been drawn, set the mplayid to 0, it indicates that four images need to be drawn to start a new animation.

 

In the main class, how do we trigger an animation by pressing a key? The ondraw () method must be implemented and re-painted continuously. The main code is as follows:

Protected void ondraw (canvas) {canvas. drawbitmap (mmapimage, 0, 0, mpaint); canvas. save (); canvas. cliprect (0, 0,320, 30); mpaint. setcolor (color. white); canvas. drawrect (0, 0,480, 30, mpaint); mpaint. setcolor (color. red); canvas. restore ();/** display animations based on key updates **/If (mallkeydown) {If (miskeydown) {manimationstate = anim_down; canvas. drawtext ("press the next key to start playing down the animation", 0, 20, mpaint);} else if (miskeyleft) {manimationstate = anim_left; canvas. drawtext ("Left click to start playing the left Animation", 0, 20, mpaint);} else if (miskeyright) {manimationstate = anim_right; canvas. drawtext ("right-click to start playing the right Animation", 0, 20, mpaint);} else if (miskeyup) {manimationstate = anim_up; canvas. drawtext ("press the upper key to start playing the upward Animation", 0, 20, mpaint);}/** draw the main character animation **/mheroanim [manimationstate]. drawanimation (canvas, mpaint, 20,100); mtestanim [manimationstate]. drawanimation (canvas, mpaint, 100,100);} else {/** press the button to lift the character and stop the animation **/mheroanim [manimationstate]. drawframe (canvas, mpaint, 20,100, 0); mtestanim [manimationstate]. drawframe (canvas, mpaint, 100,100, 0); canvas. drawtext ("the animation has been lifted to stop", 0, 20, mpaint);} super. ondraw (canvas); invalidate ();}

In this way, our animation is always being drawn.

 

We can control the flag by controlling the upper, lower, and lower buttons:

public void setKeyState(int keyCode, boolean state) {            switch(keyCode) {            case KeyEvent.KEYCODE_DPAD_DOWN:        mIskeyDown = state;        break;            case KeyEvent.KEYCODE_DPAD_UP:        mIskeyUp = state;        break;            case KeyEvent.KEYCODE_DPAD_LEFT:        mIskeyLeft = state;        break;            case KeyEvent.KEYCODE_DPAD_RIGHT:        mIskeyRight = state;        break;            }            mAllkeyDown = state;        }