# How could I make my player gradually rotate to the angle it's moving?

I don’t really understand fully how vectors work, and I’m trying to implement them in my code. I am very sure that the use of vector makes a lot of stuff easier but for now I’ll rely on the help of you guys lol

``````Vini vini;

void setup() {
size(600, 600);
//fullScreen();
surface.setLocation(600, 50);
vini = new Vini();
}

void draw() {
background(50);
vini.movement();
vini.display();
}

void keyPressed() {
if (key < 255) {
vini.keys[key] = true;
}
}

void keyReleased() {
if (key < 255) {
vini.keys[key] = false;
}
}

class Vini {

PVector pos;
PVector vel;
float rot;
final int finvel = 10;
final float accel = finvel/10;
boolean [] keys = new boolean[255];
//float triamp = -(abs(vel.x) + abs(vel.y))*10;

Vini() {
pos = new PVector(width/2, height/2);
vel = new PVector(0, 0);
}

void display() {
pushMatrix();
translate(pos.x, pos.y);
rotate(rot);
shapeMode(CENTER);
triangle(20, 12, 20, -12,-(abs(vel.x) + abs(vel.y))*10, 0);
circle(0, 0, 50);
image(seta, -19, -10, 40, 20);
popMatrix();
}

void movement() {

pos.x += vel.x;
pos.y += vel.y;

if (keys['w'] && vel.y > -finvel ) {
vel.y -= 2*accel;
rot = -PI/2;
}
else if (keys['w'] == false && vel.y < 0) {
vel.y += accel;
}
if (keys['s'] && vel.y < finvel) {
vel.y += 2*accel;
rot = PI/2;
} else if (keys['s'] == false && vel.y > 0) {
vel.y -= accel;
}
if (keys['a'] && vel.x > -finvel) {
vel.x -= 2*accel;
rot = PI;
} else if (keys['a'] == false && vel.x < 0) {
vel.x += accel;
}
if (keys['d'] && vel.x < finvel) {
vel.x += 2*accel;
rot = 0;
} else if (keys['d'] == false && vel.x > 0) {
vel.x -= accel;
}
}
}
``````

that didn’t work, the player still didn’t gradually rotate into position, and the player now was also facing to the wrong side, somehow.

Please describe what you want to achieve.

The player…?

when I press W/A/S/D, the player rotates in a constant speed to the angle of the movement. Example: D is being pressed, so when D is released and W is pressed, it’ll rotate gradually from 0 to 90 degrees, instead of instantly flipping directions. I hope that’s enough information

1 Like

still unclear description, but much better now

here is an example, where the angle gets changed slowly. It’s called easing.
(the walking direction is not effected)

• It’s unclear whether you want the walking direction effected or not.
``````
Vini vini;

void setup() {
size(600, 600);
//fullScreen();
surface.setLocation(600, 50);
vini = new Vini();
}

void draw() {
background(50);
vini.movement();
vini.display();
}

void keyPressed() {
if (key < 255) {
vini.keys[key] = true;
}
}

void keyReleased() {
if (key < 255) {
vini.keys[key] = false;
}
}

// ===================================================================================

class Vini {

final float easing = 0.0091;

PVector pos;
PVector vel;
float rotWishedFor, rotUsed;
final int finvel = 10;
final float accel = finvel/10;
boolean [] keys = new boolean[255];
//float triamp = -(abs(vel.x) + abs(vel.y))*10;

Vini() {
pos = new PVector(width/2, height/2);
vel = new PVector(0, 0);
}

void display() {
pushMatrix();
fill(0);
translate(pos.x, pos.y);
rotate(rotUsed);
shapeMode(CENTER);

// Nose
pushMatrix();
translate(20, 0);
fill(255, 0, 0);
rect(0, 0, 10, 10);
popMatrix();

triangle(20, 12,
20, -12,
-(abs(vel.x) + abs(vel.y))*10, 0);
ellipse(0, 0, 50, 50);
fill(255, 0, 0);
fill(220);
text("seta", -19, -10, 40, 20);
popMatrix();
}

void movement() {

pos.x += vel.x;
pos.y += vel.y;

if (keys['w'] && vel.y > -finvel ) {
vel.y -= 2*accel;
rotWishedFor = -PI/2;
} else if (keys['w'] == false && vel.y < 0) {
vel.y += accel;
}
if (keys['s'] && vel.y < finvel) {
vel.y += 2*accel;
rotWishedFor = PI/2;
} else if (keys['s'] == false && vel.y > 0) {
vel.y -= accel;
}
if (keys['a'] && vel.x > -finvel) {
vel.x -= 2*accel;
rotWishedFor = PI;
} else if (keys['a'] == false && vel.x < 0) {
vel.x += accel;
}
if (keys['d'] && vel.x < finvel) {
vel.x += 2*accel;
rotWishedFor = 0;
} else if (keys['d'] == false && vel.x > 0) {
vel.x -= accel;
}

rotUsed += ( rotWishedFor-rotUsed ) * easing ;
}
}//class
//

``````