Trouble with character movement

[tomstaveley]

For the movement - imagine a circle, and in the centre of that circle is the main character standing still. It also needs to be from a diablo style view (God view, and a bit to the right).

Below are the range of values in degrees that if the mouse was clicked between, would goto the corresponding movie clip of the way that the character is walking:

• Up = 337.5 to 22.5
• Up-right = 22.5 to 67.5
• Right = 67.5 to 112.5
• Down-right = 112.5 to 157.5
• Down = 157.5 to 202.5
• Down-left = 202.5 to 247.5
• Left = 247.5 to 292.5
• Up-left = 292.5 to 337.5

I hope you understand what I mean here...if not then I have really confused you and I am sorry if I have! See picture attached to give you a clearer view of what I mean...

So if any one know how to go about this problem, then please reply.

Regards,

Stibily.

P.S. If you say that I should have posted this in the actionscripting forum, or games, etc... then you are wrong 'cos I have posted this there aswell!

[jbum]

Seems like you've already done an excellent analysis of what you need to do.

What is the problem exactly?

[tomstaveley]

My problem is that I don't know the scripting for it. Any ideas?

[jbum]

Let's say you make a movie in which each frame corresponds to one of your diagonal directions (each frame would contain a movieclip with a walk cycle of the man walking in the desired direction).

I've modified the order so that it will work with atan2 (0 degrees starts pointing to the right (3:00) and then proceeds clockwise).

1 * Right
2 * Down-right
3 * Down
4 * Down-left
5 * Left
6 * Up-left
7 * Up
8 * Up-right


Set up the movieclip so the crosshairs correspond to the 'center' of the man.

Put the movieclip on the stage, and call it man_mc.

Use the following script (attached to a frame on the main timeline) to control which frame to use.

code:

---

man_mc.stop();



man_mc.onMouseDown = function()

{

  // dx,dy are the position of the mouse relative to the center of the man

  var dx = this._xmouse;

  var dy = this._ymouse;



  // get the angle of the mouse

  angle = Math.atan2(dy,dx);

  // convert to a frame number (1-8)

  frameNbr = Math.round(8+4*angle/Math.PI) % 8 + 1;

  this.gotoAndStop(frameNbr);

	// trace(angle + ", " + frameNbr);

}

---

Attached is a hastily-constructed sample movie that uses this script in the way that I describe. I'm using static pictures of the man, but instead, each frame of the man_mc movie should contain the animation you wish to use for that direction.

[tomstaveley]

Thank you so much! This is exactly what I was looking for!
I cant thank you enough!

Regards,
Stibily

[tomstaveley]

There's one more thing...do you have some script for making him move to the spot? Cos I thought that I could use the script from the sample that comes with flash (the ladybird one), but I can't seem to edit it correctly. Any ideas?

[jbum]

A modification.

code:

---

man_mc.stop();



// Use tx,ty to keep track of desired location

man_mc.tx = man_mc._x;

man_mc.ty = man_mc._y;

man_mc.walkSpeed = .2;



man_mc.onMouseDown = function()

{

        // dx,dy are the position of the mouse relative to the center of the man

        this.tx = _root._xmouse;

        this.ty = _root._ymouse;

        var dx = this._xmouse;

        var dy = this._ymouse;

        

        // get the angle of the mouse

        angle = Math.atan2(dy,dx);

        // convert to a frame number (1-8)

        frameNbr = Math.round(8+4*angle/Math.PI) % 8 + 1;

        this.gotoAndStop(frameNbr);

        // trace(angle + ", " + frameNbr);

}



man_mc.onEnterFrame = function()

{

  this._x += (this.tx - this._x)*this.walkSpeed;

  this._y += (this.ty - this._y)*this.walkSpeed;

}

---

[tomstaveley]

This is fantastic! Thanks!

Sorry, But I have two last questions though!

How do I make the character start from standing position, then go back to standing postion after he's walked to mouse click postion?

Also, is it possible to have the movement at a contant speed instead of slowing down? Or do you think that the slowing down is better? Personally I think a contant speed would look more realistic? What do you think?

Sorry to bomb-bard you with all these questions, choose to ignore them if you wish!

Thx again, you've been a great help!

Stibily

[jbum]

Rather than write the whole script, I'll give you the math, and some partial scripts in hopes that you can incorporate it into your script, and thereby learn more in the process.

The current movement system (from the last script I posted) sets a target
(tx,ty) and moves a fractional amount in that direction. Kind of like this:

_x += (tx - _x)*.2;
_y += (tx - _x)*.2;

This is sometimes called 'eased movement' or 'zenoing' (based on Zeno's paradox about a runner moving halfway to a target) and it does indeed cause your man to slow down as he comes to a stop. It's often desirable, but in your case, you're wanting a more linear kind of movement. You might want to use easing for the very end of the movement, so he doesn't jerk suddenly to a stop.

For linear movement, you want to add a constant amount to the x and y coordinates, like so.

_x += vx;
_y += vy;

The hard part is figuring out vx and vy. You start by figuring out the deltas - the distance from the man to the target.

dx = (tx - _x);
dy = (ty - _y);


If you simply did this:

_x += dx;
_y += dy;

The man would make one 'jump' to the target position. So you want to scale dx,dy to some smaller value, so that you can make a number of incremental jumps in that direction.


There are a few ways to do this. Here's one I commonly use:

// this gives you the distance to the target.
distance = Math.sqrt(dx*dx + dy*dh);

vx = dx/distance;
vy = dy/distance;

Now vx,vy make a 'unit vector' - they will cause the man to travel one pixel
in the desired direction when you do this:

_x += vx;
_y += vy;

If you want the man to go a particular speed, such as 3 pixels per frame, then multiply by that speed when you compute vx,vy.

speed = 3;
vx = speed * dx/distance;
vy = speed * dy/distance;

Using this method is pretty simple, but you may find it difficult getting the man to stop and easing the motion at the end. One way to accomplish this is to examine the distance

code:

---

// tx,ty are the target

// vx,vy are the velocity



easeFactor = .2;

speed = 3;



dx = (tx - _x);

dy = (ty - _y);

distance = Math.sqrt(dx*dx + dy*dh);

if (distance < .5) {

  // close enough, stop

  vx = 0;

  vy = 0;

}

else if (distance < 5) {

  // use easing style motion

  vx = dx*easeFactor;

  vy = dy*easeFactor;

}

else {

  // use linear motion

  vx = speed * dx/distance;

  vy = speed * dy/distance;

}

_x += vx;

_y += vy;

---

Finally a suggestion - your question is more games-oriented than physics-oriented - if you post your questions on the games forum (which is a lot busier), you'll get a lot more people answering them...

As far the standing/walking animation is concerned - you need to animate the different things you want to see, and use those animations at the appropriate points in the walk sequence. For example, when the distance < 5, and the walk cycle is on the right frame number, you could trigger the part of the animation that takes the man from a walk to a standing position.

[tomstaveley]

Thank for everything!

I'll try finding the right values for the equations and if I have any problems then I'll post in the games forum.

Once again, Thanks a lot!

Stibily

[lizzard_head]

hi i also would like to produce a point an click game but do not understand, as when i cpyd it to be on my flash my character did not move. i would be thankfully if you could help me with this

[ozmic66]

i'd love to help you out (and not to sound grouchy) but i don't feel like reading that whole thread

if u could pinpoint a specific problem, rather than saying that you moved it to flash and it's not working, it'd be much easier to help

[lizzard_head]

yea sorry it was a bit stupid now i read myn lol.
i have relised how to get the character to move now (as i have been typing the code rong).but i waould like it to be like broken sword and have him have a walk animation when he moves plus how to get it to only work in certain areas so my character wont waslk in the sky ov something.
thanx

[ozmic66]

ok... so you want to animate the character when he walks?
there are many ways to do this, and i think you'd get the best response in the 'games' room since there are more people there usually

now, is this a side scroller or top view?

i had the notion that it was top view, in which case there is no sky, so tell me what you mean by your question

if you don't want the character to walk into other objects, then this would be the right place to get help, just be a little more specific