Take the 2-minute tour ×
Game Development Stack Exchange is a question and answer site for professional and independent game developers. It's 100% free, no registration required.

I am animating a sprite. The sprite has 7 different frames, but the animation is 10 frames long. This is because 3 of the original frames appear twice in the animation:

3 -> 4 -> 5 -> 6 -> 4 -> 3 -> 2 -> 1 -> 0 -> 2

Frames 2, 3 and 4 appear twice. This avoids having to store duplicate frames in the spritesheet.

How can I render the animation in this sequence with repeated frames?

share|improve this question
    
We can't really help you because we don't know what language or animation engine you may be using. I would use an array of integers to decide the animation frame sequence but that might not be an option depending on the language/engine you're using. –  Austin Brunkhorst Jul 28 '12 at 4:05
    
Didn't think language was relevant, since I'm just after an explanation, but sure I'll add that to the question. –  hustlerinc Jul 28 '12 at 4:07
    
You need to give us how you are animating the sprites as well. –  Austin Brunkhorst Jul 28 '12 at 4:18
    
@AustinBrunkhorst I'm not animating yet? The whole point of this question is to understand HOW I should animate this? How can I go through the frames in the order I want to. –  hustlerinc Jul 28 '12 at 4:23
add comment

2 Answers 2

up vote 4 down vote accepted
  1. Record your animation sequence into an array;
  2. Remember the step you show at this frame;
  3. When next frame is coming, make the step increase, if step becomes more than animation length - set it to 0 again;
  4. Now you have looped animation.

AnimStep: Byte; // Currently displayed animation frame
AnimSprite: array [3, 4, 5, 6, 4, 3, 2, 1, 0, 2]; // Array of frame ids in a loop
AnimLength: Byte; // total array length

Render
{
  ..
  AnimStep = (AnimStep + 1) mod AnimLength; // Increase by 1 and reset to 0 at the end
  RenderSprite(AnimSprite[AnimStep]);
  ..
}
share|improve this answer
    
Putting the frame order in an array was a facepalm moment. Sometimes you miss the most obvious solutions because of the simplicity, thanks. =) –  hustlerinc Jul 28 '12 at 7:06
add comment
var animationSequence = [3, 4, 5, 6, 4, 3, 2, 1, 0, 2];
var currentFrame = 0;
var totalFrames = animationSequence.length;

// to advance a frame which will wrap round once it reaches the end
currentFrame = (currentFrame + 1) % totalFrames;

// to get current frame
var animationFrameToPlot = animationSequence[currentFrame];

An example to see it working in jsFiddle

share|improve this answer
    
can't get the fiddle to work, it just shows a bunch of numbers. +1 for putting the frame number in array though. Can't believe it didn't cross my mind. Also, what does '%' do in JS? –  hustlerinc Jul 28 '12 at 7:07
    
% is the modulo operator. And the jsFiddle is working fine, it's supposed to show the looping iterating process. –  Alayric Jul 28 '12 at 7:19
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.