[Android game development 22nd] (graphic details) Flexible animation playback in the game! Briefly describe the development of the game library and android game of j2_m2!

Li huaming himiOriginal, reprinted must be explicitly noted:
Reprinted from[Heimi gamedev block]Link: http://www.himigame.com/android-game/361.html

Due to writing a book, blog posts are updated slowly and we are considerate. Today, we will give a detailed explanation of the problem of animation implementation in the group;

This chapter is suitable for those who have not developed games!

When learning about game development, kids shoes who have worked on Android software are always fixed on Android system components! For example, animation is always implemented using classes and methods provided by bitmapdrawable, animation, and other systems!

In fact, when I used to do the development of j2's, The j2's API provided and encapsulated the sprite class from midp2.0. The generic name is the sprite class! When constructing several types of this class, you only need to provide the image size, width and height to generate an genie, because the genie class provides collision detection, animation playback, and other methods, developers can easily develop games. In fact, in the production of some more complex, or online game development, the company will not use this genie class to do it, regardless of the model, because every company has its engine and various editors, and so on, it must be extended. If Sprite is used for development, it is not only inconvenient and inflexible, but also not suitable for development with the editor and engine. But in general, the genie class is enough! However, we generally use midp1.0 to customize the spirte class provided by midp1.0, which makes it easier to maintain and customize extensions!

Besides, the game development kit provided by j2s is also a ready-to-use engine! Therefore, we can understand why, in android game development, we often see sprite shadows! There are also many colleagues who have done me to see similar code. They always say, "Isn't your android game development still the set of j2's !", Haha, that's right, but please think about it first. Now the android SDK has been upgraded to 2.3. I have heard which version provides a game development kit similar to the "game" in meapi? The answer is no. In addition, we can get our game framework in me to Android, which is also good for faster development. Of course, we do not recommend using the several game extension packages of j2's here for use directly, this is a migration --. Instead, it is a waste of game efficiency!

To sum up, it's not that you don't want to leave the ME architecture behind to play the original android game! However, Android does not have any development kits that are better suited to games;

 

Let's not talk about anything more. Today we will mainly explain how to implement animation in the game for kids shoes!

 

To achieve animation, we generally use our own images and slices to form an animation. The following describes two implementation methods:

 

First, the subscript of the Image array drawn on the canvas is constantly changed using the image array to form the animation! (Each image is an animated frame)

 

Note: The following section describes the Demo code! Please organize it yourself;

Variable: <br/> bitmap BMP 0, BMP 1, BMP 2; <br/> bitmap [] BMP _array = new bitmap [3]; <br/> int BMP index; </P> <p> initializing: <br/> BMP 0 = bitmapfaxxxxxxxx; <br/> BMP 1 = bitmapfaxxxxxxxx; <br/> BMP 2 = bitmapfaxxxxxxxx; <br/> BMP _array [0] = BMP 0; <br/> BMP _array [1] = BMP 1; <br/> BMP _array [2] = BMP 2; </P> <p> canvas: // refresh the canvas all the time <br/> canvas. drawbitmap (BMP _array [BMP Index]); </P> <p> logical: // The execution logic is always in the thread <br/> BMP index ++; <br/> If (BMP index> = BMP _array.length) <br/> BMP Index = 0;

 

In the logic, the BMP index ++ is always enabled. In order to enable the index of the Image array to the next image, an animation is formed in the canvas.

Some kids shoes say how to control the playing speed of an animation? Some say it changes the thread sleep time !!?

In game development, there is usually only one thread to control, so if you rashly change the sleep time of the thread to control the speed of the animation, it is a big mistake. We should not go to the refresh time (sleep time) of the main thread, but try to find a solution for the animation, so that other places will not be affected!

In general, the refresh time (thread sleep time) is very fast, and kids shoes are sure that the animation is playing too fast, so we can customize a timer. For example, we define a variable to consume some time! See the following code:

This code section is still DEMO code. Please note that it should be organized by yourself;

Variable: <br/> bitmap BMP 0, BMP 1, BMP 2; <br/> bitmap [] BMP _array = new bitmap [3]; <br/> int BMP index; <br/> int time; <br/> initializing: <br/> BMP 0 = bitmapfaxxxxxxxx; <br/> BMP 1 = bitmapfaxxxxxxxx; <br/> BMP 2 = bitmapfaxxxxxxxx; <br/> BMP _array [0] = BMP 0; <br/> BMP _array [1] = BMP 1; <br/> BMP _array [2] = BMP 2; </P> <p> canvas: // refresh the canvas all the time <br/> canvas. drawbitmap (BMP _array [BMP Index]); </P> <p> logical: // The execution logic is always in the thread <br/> time ++; <br/> If (time % 10 = 0) {<br/> BMP index ++; <br/>}< br/> If (BMP index> = BMP _array.length) <br/> BMP Index = 0;

 

The only difference between this code and the previous one is that a new variable time is added. We assume that the refresh time (thread sleep time) is 100 milliseconds, so time ++;

WhenIf (time % 10 = 0)In theory, it must be exactly one second. [10 (time) * 100 (thread sleep time) = 1000 (exactly one second)] This way, OK, solved!

 

Second: Use slice for animation (all frames are placed in the same image)

Those who have developed a game must be familiar with the following two figures:

Figure 1:

Figure 2:

 

Figure 1 is an image composed of the number of frames in a rule, and figure 2 is an image generated by the Action editor.

In games, the same picture of rule 1 is commonly used. Such images are much less memory than the first method for implementing animation, therefore, Figure 2 is generated by the Action Editor, which saves some trouble! I will not talk about it more here for Figure 2. Because it is associated with the editor and so on, You Can Baidu;

 

Let's take a look at Figure 1. If you read my blog frequently, you will find that figure 1 is very familiar with it, this is a demo of walking a character in [android game development 4] Simple android game framework. Chapter 4 describes the demo of walking a character, however, no special comments or instructions were made on the detailed code at the time. Today, the code is easy to use here. I will explain it to you in detail:

 

Previous Code:

 

/** <Br/> * @ author himi <br/> * <br/> // to make it easier for children's shoes to understand, I split the pictures here, <br/> // an array of four characters in the upper, lower, and lower directions <br/> private int animation_up [] = {3, 4, 5 }; <br/> private int animation_down [] = {0, 1, 2}; <br/> private int animation_left [] = {6, 7, 8 }; <br/> private int animation_right [] = {9, 10, 11}; <br/> Public void draw () {<br/> canvas = SFH. lockcanvas (); <br/> canvas. drawrect (0, 0, SW, sh, P); <br/> canvas. Save (); <br/> canvas. drawtext ("himi", bmp_x-2, bmp_y-10, P2); <br/> // here cliprect is set to visible area, remember to canvas. save (); canvas. restore (); <br/> // if you do not understand it, see [android game development 4]. Here I will mainly introduce canvas. cliprect () <br/> // and canvas. several parameters in the drawbitmap () method! <Br/> canvas. cliprect (BMP _x, BMP _y, BMP _x + BMP. getwidth ()/13, BMP _y + BMP. getheight (); <br/> // BMP _x: X coordinate of the image <br/> // BMP _y: Y coordinate of the image <br/> // BMP _x + BMP. getwidth ()/13: X coordinate of the image + width of each frame <br/> // BMP _y + BMP. getheight (): Y coordinate of the image + height of each frame <br/> If (animation_init = animation_up) {<br/> canvas. drawbitmap (BMP, BMP _x-animation_up [frame_count] * (BMP. getwidth ()/13), BMP _y, P); <br/> // BMP: this image has many frames. (figure 1) <br/> // BMP _x-animation_up [frame_count] * (BMP. getwidth ()/13): <br/> // X coordinate of the image-x coordinate of each frame (Note 1 here) <br/> // BMP _y: Y coordinate of the image <br/> // P: paint brush <br/>} else if (animation_init = animation_down) {<br/> canvas. drawbitmap (BMP, BMP _x-animation_down [frame_count] * (BMP. getwidth ()/13), BMP _y, P); <br/>} else if (animation_init = animation_left) {<br/> canvas. drawbitmap (BMP, BMP _x-animation_left [frame_count] * (BMP. getwidth ()/13), BMP _y, P); <br/>} else if (animation_init = animation_right) {<br/> canvas. drawbitmap (BMP, BMP _x-animation_right [frame_count] * (BMP. getwidth ()/13), BMP _y, P); <br/>}< br/> canvas. restore (); // Note 3 <br/> SFH. unlockcanvasandpost (canvas); <br/>}< br/> Public void cycle () {<br/> If (down) {<br/> BMP _y + = 5; <br/>} else if (up) {<br/> BMP _y-= 5; <br/>} else if (left) {<br/> BMP _x-= 5; <br/>} else if (right) {<br/> BMP _x + = 5; <br/>}< br/> If (down | up | left | right) {<br/> If (frame_count <2) {<br/> frame_count ++; <br/>} else {<br/> frame_count = 0; <br/>}< br/> If (down = false & up = false & left = false & Right = false) {<br/> frame_count = 0; <br/>}< br/> */ 

Note 1: Explain why "X coordinate of an image-x coordinate of each frame ":

Let's take a look:

Suppose: we now set the visible area to (0, 0), but the area size is exactly the width and height of each frame of the image; at this time, we will first display the frame with the subscript of 0 in the visible area. We just need to draw the entire image (0, 0), as shown in the picture. Now only the first frame can be seen, what if we want to see the second one? Of course it is usedThe X coordinate of the image-The X coordinate of each frame, you can see the frame with the subscript of 1! For example;

 

 

OK. Here I want to emphasize that we must understand this idea, because the height in Figure 1 here is exactly the height of each frame, and it may be different in the future! So here I am going to introduce you to this kind of thinking, so you must learn what to use !!! OK. Let's talk about this today and continue to write books. Thank you for your support!

 

THX everybody! Wahaha ~