Jump to content

Phaser.Sprite.call with spritesheet


ageibert
 Share

Recommended Posts

Hi there,

i got an "Actor" class, which creates all my game Enities like enemies and the player.

In this Actor class i create my enemies and player via:

Phaser.Sprite.call(this, this.game, x, y, imageRef);

I now want to create my player with a spritesheet so that i can animate him/her when pushing keys.

But i don't now how to manipulate the above code to get it working with a spritesheet.

 

Best regards

Link to comment
Share on other sites

 

The next parameter is the frame or frameName, so just add that in:

Phaser.Sprite.call(this, this.game, x, y, 'spritesheetkey', 'framename');

Thank you for your quick answer. But i'm struggeling. 

Which "framename" do i have to insert? I want the whole spritesheet to be available, so that i can work with it in my player's animation like:

 

this.animations.add("left", [0, 1, 2, 3], 10, true);this.animations.add("right", [5, 6, 7, 8], 10, true);

and later:

 

if (this.keys.leftKey.isDown) {this.x -= this.speed;this.animations.play("left");
Link to comment
Share on other sites

The framename in this case would be an idle frame - though you can just set it to 0 or leave it off entirely if you start playing animations straight away. All animations do is change the frame of the current key over a period of time. The key is the same as whatever your sprite sheet was loaded as. 

Link to comment
Share on other sites

@lewster32 thank you so far. Then i think i was right in my code before and it must be an other error.

If you could look at this file here:

https://github.com/geibi/phaser/blob/master/js/Actor.js

 

This is my basic actor class.

 

My Player class extends this class:

 

https://github.com/geibi/phaser/blob/master/js/Player.js

 

In line 3 there's

BasicGame.Actor.call(this, this.game, x, y, 'dude');

Which sets the Player up by calling it's "parent" Actor with the spritesheet "dude" to be loaded

This  spritesheet is loaded here before:

 

https://github.com/geibi/phaser/blob/master/js/Preloader.js

in line 26

this.game.load.spritesheet("dude", "images/dude.png", 32, 48);

My Player then appears right on the screen. Visualized by frame 4 (idle standing), which comes from line 64 in 

https://github.com/geibi/phaser/blob/master/js/Player.js

this.frame = 4

This is good! :)

 

But the animation is not played, when pressing my let/right/up/down keys. The animation should be played like defined in the line 46-61 in 

https://github.com/geibi/phaser/blob/master/js/Player.js

 

The animation doesn't play. The frame always stays at 4

 

Do you have any idea?

(sorry for so much code)

Link to comment
Share on other sites

Ok, the problem is here in Player.js:

  if (this.keys.leftKey.isDown) {    this.x -= this.speed;    this.animations.play("left");  } else if (this.keys.rightKey.isDown) {    this.x += this.speed;    this.animations.play("right");  }  if (this.keys.upKey.isDown) {    this.y -= this.speed;    this.animations.stop();  } else if (this.keys.downKey.isDown) {    this.y += this.speed;    this.animations.stop();  } else {    // this code will always be called when the player is not pressing up or down,    // which happens whenever the player is only moving left and right, so it stops    // any previously started animations in the same frame!    this.animations.stop();    this.frame = 4;  }

To fix this I just changed this bit of logic to the following:

  if (this.keys.leftKey.isDown) {    // moving left    this.x -= this.speed;    this.animations.play("left");  } else if (this.keys.rightKey.isDown) {    // moving right    this.x += this.speed;    this.animations.play("right");  }  else {    // not moving left or right, so stop the walking animation    this.animations.stop();    this.frame = 4;  }    if (this.keys.upKey.isDown) {    // moving up    this.y -= this.speed;  } else if (this.keys.downKey.isDown) {    // moving down    this.y += this.speed;  }
Link to comment
Share on other sites

No problem - love the structuring of your code otherwise, nice to see good use of inheritance :)

Thanks for this. :)

It's a bit harder at first, because most phaser examples and tutorials are provided as non "oop code". But for me "oop" is the only way to go here, because it would be so much repetition it would soon get really messy without this structure.

 

Anyway... There's a long way to go for me. I'm unsure in every step if i'm placing my code in the right class. But slowly i'm getting the hang of it :)

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...