animated image question

[IMG]http://img169.imageshack.us/img169/2474/customerf001eatzp8.png[/IMG]
the above image is taken from yahoo game, Family Restaurant,.
there not complete full frame is drawn for animated frames.
if mouth move, only mouth is drawn in a frame, for hand only drawn hand in frame.

what i want to know is, what's the different between the full completely drawn frame vs only animated portion of frame with lots of transparency?

oh. BTW, how can i show my images in this forum? what's the TAG for it?

I think I know what you're asking.
That method can be used for Composite Sprites which allow you to build different characters from different base elements and/or you can animate the characters by rotating/moving each of the elements rather than drawing separate frames.
e.g. Rotate the leg about a hip joint for a kick rather than have separate images of the leg down, leg half-way up and leg in full kick position.
What are the forum codes

sorry, image is here,


BTW, how can i show my image in forum?

Oppss!!!
i just put image link in here, and it shows...
i tought, i need to use like [img] tags.. :D he he

OK, so it's a composite anim. For example, Rather than draw the whole girl with her eyes open and again blinking, just the eyes are overdrawn.
<edit> You save on time to draw the images and space either in memory or on disk.

Using such image-strips needs a different approach than "loadanimimage".

For each sprite an offsetX, offsetY, width and height is needed. Loading only parts of the image (within the given coords) will save some memory of gpu and ram. Encapsulating this in your own types you can have some fields storing the offsets to enable drawing like:

drawimage(img_body, x,y)
drawimage(self.partimage, x + self.offsetx, y + self.offsety)


The difference to the standard method is: if you also save coords for rotation and so, you can create more animation poses (like tonyg said) but you will have to code way more to gain some memory savings.

If you render all your sprites of from 3d models, I would not use this way because it's easier to manipulate it in your 3D-App. Only if you use straight bitmap-editing (no vectors) this approach seems needful.

Another thing: this method is only useful if your sprite is finished. Making changes after you split down your frames is painful because again a "select, copy, paste" is needed. Ok, if you have 1 sprite its not that worse, but imagine having 100 sprites which need a slight change.

But before I forget to mention it: i saw this "composite sprites"-method in some casual games (ok I had to extract them from packed files ... so I don't know how they linked them together). They even used it for sprites of 24x24 dimensions - with closing eyes as separate images with 6x6. They used it for all sprites of figures they had. I think they have done more work in coding than in making the sprites. Sometimes it is just easier to still use the method of each frame being completely and not being created out of different parts.

Ok enough of it - most of my post just got offtopic ;D.

bye MB

Here's some code I whipped up using the above image. Hope it helps.

SuperStrict
Graphics 800,600

Local Image:TImage = LoadAnimImage("customerf001eatzp8.png",73,120,0,11)
Local BlinkTime:Int = MilliSecs() + 2000 'time til next blink
Local FrameTime:Int = MilliSecs() + 333 'time til next frame
Local Blink:Int = False 'blinking?
Local Frame:Int = 0 'current frame
Local Back:Int = False 'are we viewing from the back?
Local Eat:Int = True 'are we eating?

While Not KeyHit(KEY_ESCAPE) And Not AppTerminate()
	Cls
	
	If Back 'she is facing away from us
		If Eat
			DrawImage Image,100,100,frame+7 'she is eating and facing away from us
		Else
			DrawImage Image,100,100,6 'she is not eating and facing away from us
		End If
		DrawImage Image,100,100,10 'Draw the legs
	Else 'she is facing toward us
		If eat
			DrawImage Image,100,100,4 'draw the body
			DrawImage Image,100,100,frame 'draw the arm
		Else
			DrawImage Image,100,100,3 'not eating
		End If
		If Blink 'is she blinking?
			DrawImage Image,100,100,5
		End If
	End If
	DrawText "B = Swap font/back view",10,500
	DrawText "E = Start/Stop eating",10,530
	Flip
	
	If MilliSecs() >= BlinkTime
		If Blink 'was she already blinking?
			Blink = False 'open eyes
			BlinkTime :+ 2000 '2 seconds before next blink
		Else
			Blink = True 'close eyes
			BlinkTime :+ 500 'keep eyes closed for .5 seconds
		End If
	End If

	If MilliSecs() >= FrameTime 'update the frame
		Frame :+ 1
		If Frame = 3 Then Frame = 0
		FrameTime :+ 333
	End If

	If KeyHit(KEY_B) 'swap back-front view
		If Back
			Back = False
		Else
			Back = True
		End If
	End If

	If KeyHit(KEY_E) 'swap eating, not eating
		If Eat
			Eat = False
		Else
			Eat = True
		End If
	End If	
Wend