Sorry your browser is not supported!

You are using an outdated browser that does not support modern web technologies, in order to use this site please update to a new browser.

Browsers supported include Chrome, FireFox, Safari, Opera, Internet Explorer 10+ or Microsoft Edge.

AppGameKit Classic Chat / How to create an animated sprite

Author
Message
JORGEMAL
14
Years of Service
User Offline
Joined: 2nd Aug 2009
Location:
Posted: 2nd May 2012 21:46
How do I create an animated png to be used as a sprite?
Or, how do I create an animated sprite for my AppGameKit game?
What is the correct approach to implement animation in an AppGameKit game?

I am new to this subject so I will very much appreciate an explanation as detailed as possible.

Respectfully,
Jorge Maldonado
baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 2nd May 2012 21:57
There are a number of ways go do animation, the most common way is to create a number of images that represent each frame of animation and to play the animation one frame at a time. Another way is to use individual sprites for each part of your character and rotate / position them manually.

The first method can be achieved either using individual images or a spritesheet containing multiple images.

DVader
20
Years of Service
User Offline
Joined: 28th Jan 2004
Location:
Posted: 4th May 2012 17:26
You can either use individual frames, load them in separately. Create a sprite and use the AddSpriteAnimationFrame command for each of the frames. Alternately, you can create a sprite sheet with your frames gridded on to it and use SetSpriteAnimation to set it up in one go.
The first method should work with any sized images, but the second you need to ensure the images are ^2. So ranges such as 16x16,32x32,64x64, and so on will work ok for sprite sizes. Also combinations are allowed so you could have 256x512 for instance.
Baxslash has already suggested these options above, but I thought I would expand on the basics as you said you were new. The final method, that baxslash suggests is a good one for memory savings, but nowhere near as simple to get working. He has put up a little example on these forums if you want to investigate. However you would need spriter, to make use of that method, or some other easy way to arrange your animations. If you are a beginner, I suggest you stick with the first 2 methods for starters.

JORGEMAL
14
Years of Service
User Offline
Joined: 2nd Aug 2009
Location:
Posted: 5th May 2012 21:27
I downloaded exp10 spritesheet from baxslash free resources and I have not been able to make it work.
The size of the exp10 image is 768x640 and it contains 30 frames, so this means that each frame is 128x128.
I included my test code for your consideration, I will appreciate any comments and suggestions.
Regards,
Jorge Maldonado

baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 5th May 2012 21:34
I would just add this line in your initAsteroid function at the end:
PlaySprite(1, 15, 1)

JORGEMAL
14
Years of Service
User Offline
Joined: 2nd Aug 2009
Location:
Posted: 8th May 2012 02:20
Quote: "
I would just add this line in your initAsteroid function at the end:
PlaySprite(1, 15, 1)
"


I appreciate your response, it worked, but I have a comment. My animation loops forever (which is what I need), but I can notice when animation ends and when it starts again. Is it possible to get rid of this effect?

With respect,
Jorge Maldonado
baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 8th May 2012 10:40 Edited at: 8th May 2012 10:58
Using the code I posted it should loop forever unless you tell it to stop. Can you post your code?

EDIT: Just realised I misread your post. I'm guessing you're either loading the wrong number of frames or your animation is not right. Can you post the sprite and the code?

JORGEMAL
14
Years of Service
User Offline
Joined: 2nd Aug 2009
Location:
Posted: 8th May 2012 20:12 Edited at: 9th May 2012 19:09
Quote: "
Just realised I misread your post. I'm guessing you're either loading the wrong number of frames or your animation is not right. Can you post the sprite and the code?
"


I include my test code for your review and attach the sprite.
Thank you for your support.


Attachments

Login to view attachments
JORGEMAL
14
Years of Service
User Offline
Joined: 2nd Aug 2009
Location:
Posted: 9th May 2012 19:11
Hello Baxslash,

Have you seen my code example and sprite in the previous post?

Best regards,
Jorge Maldonado
Marl
12
Years of Service
User Offline
Joined: 19th Nov 2011
Location: Bradford, UK
Posted: 9th May 2012 19:59
Quote: "but I can notice when animation ends and when it starts again."

Are the animation frames designed to be looped?

If not, your code could be perfect and the reset will still be noticeable.
baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 9th May 2012 20:29
Hi, yes I will try to take a look ASAP been very busy, sorry!

JORGEMAL
14
Years of Service
User Offline
Joined: 2nd Aug 2009
Location:
Posted: 9th May 2012 21:40 Edited at: 9th May 2012 21:41
I really appreciate your time, I will wait until you have the moment to help me.

Quote: "Are the animation frames designed to be looped?"


What do you mean with this? I am a real newbie in sprite animation.

Thank you for your patience.
Jorge Maldonado
Marl
12
Years of Service
User Offline
Joined: 19th Nov 2011
Location: Bradford, UK
Posted: 9th May 2012 22:28
Quote: "What do you mean with this? I am a real newbie in sprite animation"

Well you indicated that you used one of Baxslash's explosion animations.

Explosions generally don't repeat - they happen once and then go away.

So if you play this in a continual loop, when it repeats it is showing the first frame immediately after the last one, which could look like a jump in the animation.

I didn't want you redoing code to try to fix a problem which wasn't really there if it was caused by this kind of jump.
baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 10th May 2012 13:21
The problem was you were trying to load thirty frames and there are only 3 in your image. Change this line:
setspriteanimation(1, 128, 128, 30)

...to this:
setspriteanimation(1, 128, 128, 3)

It works much better

JORGEMAL
14
Years of Service
User Offline
Joined: 2nd Aug 2009
Location:
Posted: 10th May 2012 18:49
Quote: "The problem was you were trying to load thirty frames and there are only 3 in your image."


My big mistake, I need to read the documentation better. I appreciate your time and support.

With respect,
Jorge Maldonado
baxslash
Valued Member
Bronze Codemaster
17
Years of Service
User Offline
Joined: 26th Dec 2006
Location: Duffield
Posted: 10th May 2012 18:55
No problem!

Having said that it occurs to me that AppGameKit should only be "trying" to load 30 images and should stop when it realises there are only 3. This may be a bug anyway but yes it helps to read the documentation for every command. I tend to use the documentation A LOT

DVader
20
Years of Service
User Offline
Joined: 28th Jan 2004
Location:
Posted: 10th May 2012 20:10
It can be useful to have blank frames baxslash, as it automatically hides the sprite on the last frame without the need for set sprite visible. I tend to use it anyway, but occasionally it helps keep things tidy when testing stuff, or when you know you going to delete the sprites immediately after. No good if you use visibility for an extra collision check though. Still, my point is, they can have a purpose, mostly explosions lol.

Login to post a reply

Server time is: 2024-05-04 08:52:57
Your offset time is: 2024-05-04 08:52:57