Making the arms of a sprite rotate towards your mouse position

[michaelcalkins]

I want my player's arms and weapon to point at wherever the mouse is currently at.

Soldat already does a good job of this and I can't figure out how to build the player so that they have a running animation and their arms and gun follow my mouse.

The file I attached is a screenshot of a vector that I can cut up into pieces and has example positioning.

I was trying to make a group and attach sprites to that group but I could not get the arms to rotate correctly for some reason.

 

[mattstyles]

I'm not sure this is going to be particularly easy, that texture atlas, for example, you can cut the gun and arm out and rotate that (anchor it at the shoulder obviously) but you're going to have to draw the sprite underneath. So you'd have two basic 'shapes', the body of the character and the gun + arm.

If you know your maths its fairly trivial to work out the angle between two points, in this case, where the mouse currently is in the world and where your character currently is. Infact, you can probably simplify this to just use two points on the screen rather than translate it into world space. It doesnt matter where those points actually are, only that they are relative to each other.

Once you have the angle you simply rotate the arm+gun using that angle. You'll need that angle to work out where to fire the bullet anyway.

[michaelcalkins]

1 minute ago, mattstyles said:

I'm not sure this is going to be particularly easy, that texture atlas, for example, you can cut the gun and arm out and rotate that (anchor it at the shoulder obviously) but you're going to have to draw the sprite underneath. So you'd have two basic 'shapes', the body of the character and the gun + arm.

If you know your maths its fairly trivial to work out the angle between two points, in this case, where the mouse currently is in the world and where your character currently is. Infact, you can probably simplify this to just use two points on the screen rather than translate it into world space. It doesnt matter where those points actually are, only that they are relative to each other.

Once you have the angle you simply rotate the arm+gun using that angle. You'll need that angle to work out where to fire the bullet anyway.

My character is a vector and has all the body parts separated.  Could I make the legs, body, and head a sprite and animate them.  Then have the arms and gun attached independently?

[mattstyles]

Just now, michaelcalkins said:

My character is a vector and has all the body parts separated.  Could I make the legs, body, and head a sprite and animate them.  Then have the arms and gun attached independently?

Ah, perfect, yeah, of course you can, its a useful technique. With the right sprite selection you can even mix-and-match body parts to create new entities or new animations.

I'm pretty sure with Phaser/pixi you can create sprite groups, so the group represents your character and you move the x,y as the character moves, you then set the body to 0,0 within that group and position the arm+gun wherever it needs to go within this group (looks like its about 20,50 or so pixels from the top-left origin). Pixi then handles translating all those elements, given their grouping, into screen coordinates so you don't have to do much work at your end. I think rotate also goes from 0,0 (top-left), you might need to change the rotate origin slightly as you probably want the anchor point bang in the middle of the shoulder.

[michaelcalkins]

3 minutes ago, mattstyles said:

Ah, perfect, yeah, of course you can, its a useful technique. With the right sprite selection you can even mix-and-match body parts to create new entities or new animations.

I'm pretty sure with Phaser/pixi you can create sprite groups, so the group represents your character and you move the x,y as the character moves, you then set the body to 0,0 within that group and position the arm+gun wherever it needs to go within this group (looks like its about 20,50 or so pixels from the top-left origin). Pixi then handles translating all those elements, given their grouping, into screen coordinates so you don't have to do much work at your end. I think rotate also goes from 0,0 (top-left), you might need to change the rotate origin slightly as you probably want the anchor point bang in the middle of the shoulder.

Ok going to give that another shot, I think I got frustrated beforehand because the child sprites were having gravity applied to them so the arms would sink down to the ground and rotate.

[mattstyles]

1 hour ago, michaelcalkins said:

Ok going to give that another shot, I think I got frustrated beforehand because the child sprites were having gravity applied to them so the arms would sink down to the ground and rotate.

Oh, I hadnt really considered that.

Given that sprites and bodies should be separate, and bodies/entities should be the only thing gravity/physics operates on, there must be a way to separate it all out. i.e. gravity is part of your simulation and the simulation is (should be) independent of the visualisation.

[michaelcalkins]

1 minute ago, mattstyles said:

Oh, I hadnt really considered that.

Given that sprites and bodies should be separate, and bodies/entities should be the only thing gravity/physics operates on, there must be a way to separate it all out. i.e. gravity is part of your simulation and the simulation is (should be) independent of the visualisation.

Im' pretty sure it's because I was activating physics on the other body parts by mistake.