How To

Animating Sprites

0

-SkyLock24- 2021-03-07 03:29

How do you animate sprites? For example, how do you make a character walk as you move them?


-SkyLock24- 2021-03-07 03:31

Also, how do you flip sprites?


was8bit 2021-03-07 06:22 (Edited)

The trick two fold...

FIRST, have one main game loop....

DO


WAIT VBL
LOOP

use GOSUBS or SUBs to keep big chunks of code out of the main loop and keep your code organized, but do NOT use any more WAIT commands other than the one in your main game loop... this will ensure your game loop is running at 60 cycles per second....

SECOND, establish seperate controls for each different animations.. each animation must have the freedom to have its own images and its own animation speed... this is how i do it....

The timing of the animation is done like this... lets say for the player, so i will add "p" to indicate Player

PWAIT=(PWAIT+1) MOD PMOD
IF PWAIT=0 THEN
... animation code...
END IF

Actually, you can use this to time ANYTHING, not just animation... but MOD 1 means it will run as the same speed as your game loop, or 60 times a second.. MOD 6 means it executes the code 60/6 or 10 times a second... MOD 60 will execute only once a second....


was8bit 2021-03-07 06:29

THIRD, the animation code... IF your graphics are only a few frames, and in a row like char#4,5,6,7.... or 4,6,8,10... then an easy code would be

ADD PFRAME ,1,4 TO 7
or
ADD PFRAME,2,4 TO 10

then use
SPRITE #,,,PFRAME
to update the image...

IF you are using different graphics that do NOT all align sequentially (like, 4,5,6,22,25,27) for some reason, you will need to add an extra step..

DIM PCHARFRAME(6)
FOR I=1 TO 6
READ PCHARFRAME(I)
NEXT I
DATA 4,5,6,22,25,27

Then your animation code would be

ADD PFRAME1,1 TO 6

SPRITE,#,,PCHAEPRFRAME(PFRAME)

To update your image...


was8bit 2021-03-07 06:32 (Edited)

So.. as an example...

REM MAIN LOOP
DO

... game code ...

REM PLAYER ANIMATION
PWAIT=(PWAIT+1) MOD 6
IF PWAIT=1 THEN
ADD PFRAME,1,2 TO 8
SPRITE 0,,,PFRAME
END IF

... more game code...


WAIT VBL
LOOP


was8bit 2021-03-07 06:34

SPRITE command allows you to only change certain parts, so

SPRITE 0,,,PFRAME
doesnt change sprite position, only image

SPRITE 0,PX,PY,
doesnt change image, only position...


was8bit 2021-03-07 06:37 (Edited)

SPRITE 0 FLIP 1,1 PAL 2 SIZE 2 PRI 1

You must remember to use

SPRITE #
To indicate the spriten# you are editing, but this format is ONLY for changing FLIP, PALETTE, or SIZE or PRIORITY

This format allows you to set these IN ANY ORDER, and may omit any or use all...


was8bit 2021-03-07 06:52

To explore more complicated issues for animating a main character, check out the code in this...

https://lowresnx.inutilis.com/topic.php?id=1679


was8bit 2021-03-07 06:56

Now, for an approach for using different sets of animations for different directions, let me know... but i recommend you understand what we have here first before adding more,,.


Timo 2021-03-07 10:20

Here is a simple solution for an animation loop:
Let's assume your animation has 4 frames and uses characters 8, 9, 10 and 11.

SPRITE 0,X,Y,8+(TIMER/15 MOD 4)

Here the "8" is the first character, the "4" is the number of frames, and the "15" is the speed. As the speed is divided by, it means the higher the number, the lower the speed. 60 would mean 1 frame per second.

As was8bit said, it must run in a loop:

DO
SPRITE 0,X,Y,8+(TIMER/15 MOD 4)
WAIT VBL
LOOP


was8bit 2021-03-07 12:02

@Timo...

Absolutely your code is more concise... but lets say a player decides to adjust the WAIT VBL to WAIT 10 to slow their game down... the TIMER/# method at this point will skip animation frames, where the longer code retains all frames in its animation...

Also, the longer code can offer more flexibility.... as in adding timed sound effects on some frames IF FRAME=2 or FRAME=4 PLAY ... or swapping out one frame in the animation for another image determined by the value of a condition... IF FRAME=2 THEN IF MUD THEN... ELSE .....

However, for most games, your code would be the best option...


Log in to reply.