Spritesheet Animation Question

[Edricus]

I was working with sprite sheet animations recently and something just hit me. Obviously animating a sprite sheet where every frame is the same width and height is easy with Phaser. But how would someone go at animating a sprite sheet where one frame is wider or thinner then the previous frames?

 

Here is an example sprite sheet to hopefully convey what I mean.

In the second row you can see that Mega Man's 4th last frame is slimmer then some of the other frames. How would this be animated through Phaser to play smoothly?

 

Thanks in advance,

[lewster32]

Sprite sheets should have all of the frames set to the same size - if you use an atlas to do this (which is the only way you can do it easily) then as long as the frames are the same size when going into your atlas tool (TexturePacker is my recommendation here) any trimming or cropping should be accounted for.

[Edricus]

Sprite sheets should have all of the frames set to the same size - if you use an atlas to do this (which is the only way you can do it easily) then as long as the frames are the same size when going into your atlas tool (TexturePacker is my recommendation here) any trimming or cropping should be accounted for.

 

So does this mean in the event that one frame has a wider stance that all frames should replicate the width of the widest frame?

[lewster32]

Yes, though with the use of a properly trimmed atlas you won't be wasting pixels on your visual assets. It is however up to you to ensure that all of the frames align correctly.

[jouniii]

Just question. Is it a bug or related to this feature that if I have texture atlas spritesheet with varying size images the anchor alignment is not correct reset when using ie. frameName to change to different image in Phaser.Sprite (and/or Phaser.Image)?

 

The case I'm having is that I have ie. size 44x44 and 132x132 in texture atlas. Phaser.Sprite has anchor set to (0.5, 0.5) I switch from the created image 44x44 to new one with frameName 132x132. The alignment center point seems ok, but when switching back to the original 44x44 sized frame, the anchor point is as if the image was still the 132x132 sized, thus the image is misaligned. No pivot or scale had effect in results. Seems there's some caching happening with setFrame? Or should I call resetFrame manually in this case?

 

This happens at least with Phaser 2.0.7. As workaround for now, we'll have all those images same size...