Heppell08 Posted January 14, 2014 Share Posted January 14, 2014 Pretty much the title. I have a 5 frame character and i want to use 3 frames for walking, 1 frame for jumping and another for dying. I also need to know how to reverse the image so left faces left and right faces right. I almost posted on how to use JSON but figured it out. Just need help with reversing an image and using certain frames of an image.Thanks in advance Link to comment Share on other sites More sharing options...
m4uro Posted January 14, 2014 Share Posted January 14, 2014 To flip the sprites, reverse the sign of the scale property:sprite.scale.x *= -1; //flip horizontallysprite.scale.y *= -1; //flip verticallyRemember to set the anchor properly, generally:sprite.anchor.setTo(0.5, 0.5); //so the texture of the sprite is centered Heppell08 1 Link to comment Share on other sites More sharing options...
Heppell08 Posted January 14, 2014 Author Share Posted January 14, 2014 To flip the sprites, reverse the sign of the scale property:sprite.scale.x *= -1; //flip horizontallysprite.scale.y *= -1; //flip verticallyRemember to set the anchor properly, generally:sprite.anchor.setTo(0.5, 0.5); //so the texture of the sprite is centered So if i have for example my character walking to the left, i would have it asfunction update() { if(cursors.left.isDown) { player.body.velocity.x = -150; sprite.scale.x *= -1; player.animations.play('left'); }}Like that to use it? Also is there a specific way to use a specific frame at a specific time EG: player dies, play death animation but from JSON array instead. Dont know if its possible but worth asking i suppose if someone knows. Thanks for the scale tip Link to comment Share on other sites More sharing options...
jpdev Posted January 14, 2014 Share Posted January 14, 2014 If you use it like that, you sprite will constantly flip while the left key is pressed. Because every update method "sprite.scale.x *= -1;" will change the direction again and again - so you only do it when you press the key first. if (sprite.scale.x > 0) { sprite.scale.x *= -1;} And if you press the right-curosr-key, you have to flip it back to be a positive number. If you do not scale your sprite, you could skip the check and just set it to "-1" for left, and "1" for walking right. (instead of changing the sign only.) Also you might not want to have an animation named "left" because you can use the same walk animation for left and right (because you flip the sprite). Link to comment Share on other sites More sharing options...
XekeDeath Posted January 14, 2014 Share Posted January 14, 2014 sprite.frameName can be used to set a single frame by name rather than index. Link to comment Share on other sites More sharing options...
Heppell08 Posted January 14, 2014 Author Share Posted January 14, 2014 So where would the frame name and the JSON be linked though. Like in relation to the amount of images being used in the spritesheet. I used TexturePacker to create the sheet and JSON. Its only 5 frames and 3 are for walking. 1 jumping and 1 dead. I don't see where the JSON and frame names come in. Link to comment Share on other sites More sharing options...
XekeDeath Posted January 14, 2014 Share Posted January 14, 2014 Generally, it would generate the frame name from the file name. Link to comment Share on other sites More sharing options...
Recommended Posts