how to animate correctly???

Started by
11 comments, last by TargetP 18 years ago
Hi, i'm trying to get a grasp on animation in 2D, so I wrote a program in Allegro that displays a filled circle with an "X" on it which rotates across the screen. I drew this with white as the background, and to compensate for the white I made the background in the actual program white. Now, this looks fine because the background on the bitmap and the background on the screen are blended together. But what about when the background in the program is a different color from the background in the bitmap: The extra color in the bitmap is displayed onto the screen with the circle. So what I want to know is how to get what I want dislayed on the screen without any extra shapes or colors displayed on the screen? I've also tryed to make the background of my bitmap transparent but none of the file Allegro can load support transparency. Thanks for any help Edit: Also how would you go about displaying an image on the screen when there are multiple colors in the background like in a typical sidescroller like Mario or something?
Advertisement
In all your sprites, you need to make anything you don't want rendered to be hot pink (RGB(255, 0, 255)) because that is the color key Allegro uses by default. Then when you want to render your sprites, call the draw_sprite function for that and it will draw with transparency. Hope that helps.

-AJ
V/R,-AJThere are 10 kinds of people in the world: Those who understand binary and those who don't...
alright, I did that, but now there's a trail of the previous balls in the area that's not used by my image. I've tryed clearing the area where my bitmap is placed but my image flickers.
You need to do double buffering. There's an article here that has information on double buffering and loads more info for Allegro. A great resource for beginners.

-AJ
V/R,-AJThere are 10 kinds of people in the world: Those who understand binary and those who don't...
I believe I did use double buffering, unless I misinterpretted the whole concept of it. Here's some code from my program if you want to check it (there's still trailing of ball in the area where I blit the ball image. The trailing is strictly limited to the unused space in the bitmap if that helps at all):

while (!key[KEY_ESC]) {          clear_bitmap(buffer);          clear_to_color(buffer, makecol(0, 255, 0));                     if (key[KEY_UP]) {                           bmpy = bmpy - 10;                           if (bmpy < -100) {                                    bmpy = 768;                                    }                                    moveballright();                           }          else if (key[KEY_DOWN]) {               bmpy = bmpy + 10;               if (bmpy > 768) {                        bmpy = -100;                        }                        moveballleft();                        }          else if (key[KEY_RIGHT]) {               bmpx = bmpx + 10;               if (bmpx > 1024) {                        bmpx = -100;                        }               moveballright();                        }          else if (key[KEY_LEFT]) {               bmpx = bmpx - 10;               if (bmpx < -100) {                        bmpx = 1024;                        }                        moveballleft();                        }          acquire_screen();     textprintf_ex(buffer, font, 0, 0, makecol(255, 0, 0), -1, "Animation program - by Bpaterni");      draw_sprite(screen, buffer, 0, 0);     release_screen();          	}    destroy_bitmap(buffer);    destroy_bitmap(circleanim);    clear_keybuf();	allegro_exit();}ENE_OF_MAIN()
Forgive me if I missed something, but I can't see in that code where you are drawing your animation.

-AJ
V/R,-AJThere are 10 kinds of people in the world: Those who understand binary and those who don't...
sorry, I blitted the image to the buffer in moveballright() and moveballleft()
here's the code for those functions:
void moveballright() {     if (frame == 0){           blit(circleanim, buffer, 0, 0, bmpx, bmpy, 100, 100);           }     else if (frame == 1) {               blit(circleanim, buffer, 100, 0, bmpx, bmpy, 100, 100);               }     else if (frame == 2) {               blit(circleanim, buffer, 200, 0, bmpx, bmpy, 100, 100);               }     else if (frame == 3) {               blit(circleanim, buffer, 300, 0, bmpx, bmpy, 100, 100);               }     else if (frame == 4) {               blit(circleanim, buffer, 400, 0, bmpx, bmpy, 100, 100);               }     else if (frame == 5) {             blit(circleanim, buffer, 400, 0, bmpx, bmpy, 100, 100);             }     else if (frame == 6) {               blit(circleanim, buffer, 500, 0, bmpx, bmpy, 100, 100);               }     else if (frame == 7) {               blit(circleanim, buffer, 600, 0, bmpx, bmpy, 100, 100);               }     else if (frame == 8) {               blit(circleanim, buffer, 700, 0, bmpx, bmpy, 100, 100);               }              frame = frame + 1;              if (frame >= 8) frame = 0;                        }                        void moveballleft() {              if (frame == 0){           blit(circleanim, buffer, 0, 0, bmpx, bmpy, 100, 100);           }     else if (frame == 1) {               blit(circleanim, buffer, 100, 0, bmpx, bmpy, 100, 100);               }     else if (frame == 2) {               blit(circleanim, buffer, 200, 0, bmpx, bmpy, 100, 100);               }     else if (frame == 3) {               blit(circleanim, buffer, 300, 0, bmpx, bmpy, 100, 100);               }     else if (frame == 4) {               blit(circleanim, buffer, 400, 0, bmpx, bmpy, 100, 100);               }     else if (frame == 5) {          blit(circleanim, buffer, 400, 0, bmpx, bmpy, 100, 100);          }     else if (frame == 6) {               blit(circleanim, buffer, 500, 0, bmpx, bmpy, 100, 100);               }     else if (frame == 7) {               blit(circleanim, buffer, 600, 0, bmpx, bmpy, 100, 100);               }     else if (frame == 8) {               blit(circleanim, buffer, 700, 0, bmpx, bmpy, 100, 100);               }              frame = frame - 1;              if (frame <= 0) frame = 8;                        }


Also, I remember reading somewhere that there is a better way to shorten this kind of stuff down so it doesn't take so many else if statements. Who knows, maybe this is my problem right there?
In your main loop, the part you posted first, right after you're done drawing everything, try adding the line:

vsync();


And that should make it wait until the monitor is ready and should take care of your flickering problems. Hope that helps.

-AJ
V/R,-AJThere are 10 kinds of people in the world: Those who understand binary and those who don't...
alright, that still didn't take care of it :( The problem's not really flickering it's just that the previous 2 or 3 images of the ball stay in their previously assigned spot until the whole part of the frame moves out of that spot. It's kinda hard to explain. I guess trailing is the best I can describe it with.
Quote:Original post by bpaterni3
Also, I remember reading somewhere that there is a better way to shorten this kind of stuff down so it doesn't take so many else if statements. Who knows, maybe this is my problem right there?



Yes there is, but I don't suspect it's your problem. It's called a switch statement and it goes a little something like this:

switch(frame){    case 0:        //do 0        break;    case 1:        //do 1        break;    //etc etc...}



And I was thinking and perhaps you could have a BITMAP and based on the value of frame, set the BITMAP equal to the current frame's image and always just draw the one BITMAP. Worth a shot and I hope it helps.

-AJ
V/R,-AJThere are 10 kinds of people in the world: Those who understand binary and those who don't...

This topic is closed to new replies.

Advertisement