Jump to content

[Solved]How to rotate the object and reverse the image


khleug35
 Share

Recommended Posts

Happy New Years every one.

I use this sample to create some game that the user can use their mouse to change the gun direction 

https://phaser.io/examples/v2/arcade-physics/angle-to-pointer

I use the gun image to replace the arrow.png image 

I hope when the object rotate to left or right ,the image(gun) can reverse like the following image.

The following image is when the pointor go to the top left

Normal.png.4207d30a140604e8ceee509c50860b7c.pngyes.png.8a87d5c318ef3536d1b20fb718ba948c.png

 

Here is my Script:

var sprite;
var faceRight = false;
var faceLeft = true;

 

//I try to use the follow script to fix the sprite postion
 
if(sprite.angle <= 90 && sprite.angle >= -90){
        console.log("Right");
    	if (faceLeft == true) {
	     sprite.scale.y *= -1;
	     sprite.anchor.y = 0.5;
	     faceLeft = false;
	     faceRight = true;
		}
    }else{
    console.log("Left");    
     if (faceRight == true) {
	    sprite.scale.y *= -1;
	    sprite.anchor.y = 0.5;
	    faceRight = false;
	    faceLeft = true;
		}
    }   

But not successful, The following image is my fail example,   any idea how to do it?? thx

NO.png.fcfc07a2d6e8d7ac3195025ee1c01b4d.png

 

Thanks you very much, I am sorry for my pool English.

Link to comment
Share on other sites

Happy new year! : )

EDITED:

//variables
var flip = 0;
var gun_distX;

//update
gun_distX = game.input.x - this.gun.x;

/*
flip = 0 - mouse is on the right side of the gun
flip = 1 - mouse is on the left side of the gun
*/

switch (flip) {
    case 0:
        if (gun_distX < 0) {
            flip = 1;
            this.gun.scale.y *= -1;
        }
        break;
    case 1:
        if (gun_distX >= 0) {
            flip = 0;
            this.gun.scale.y *= -1;
        }
        break;
}

You basically subtract x position of mouse and gun to get the distance between the two.

If the value is positive then the mouse is on the right side of the gun and vice versa; flipping the gun accordingly.

~~~

You might work with these too later on, altough the above is enough.

var gun_distX,
    gun_distY,
    gun_angle,
    gun_degree;

gun_distX = game.input.x - this.gun.x;
gun_distY = game.input.y - this.gun.y;
gun_angle = Math.atan2(gun_distX, gun_distY);
gun_degree = gun_angle * 180 / Math.PI;

 

Good luck! ;)

Edited by 3man7
Link to comment
Share on other sites

On 2018/1/3 at 5:36 AM, 3man7 said:

Happy new year! : )

EDITED:


//variables
var flip = 0;
var gun_distX;

//update
gun_distX = game.input.x - this.gun.x;

/*
flip = 0 - mouse is on the right side of the gun
flip = 1 - mouse is on the left side of the gun
*/

switch (flip) {
    case 0:
        if (gun_distX < 0) {
            flip = 1;
            this.gun.scale.y *= -1;
        }
        break;
    case 1:
        if (gun_distX >= 0) {
            flip = 0;
            this.gun.scale.y *= -1;
        }
        break;
}

You basically subtract x position of mouse and gun to get the distance between the two.

If the value is positive then the mouse is on the right side of the gun and vice versa; flipping the gun accordingly.

~~~

You might work with these too later on, altough the above is enough.


var gun_distX,
    gun_distY,
    gun_angle,
    gun_degree;

gun_distX = game.input.x - this.gun.x;
gun_distY = game.input.y - this.gun.y;
gun_angle = Math.atan2(gun_distX, gun_distY);
gun_degree = gun_angle * 180 / Math.PI;

 

Good luck! ;)

Thanks!!!! It works!!! thanks 3man7!!!!

thank you for your help!!! you are awesome, Thanks

Link to comment
Share on other sites

 Share

  • Recently Browsing   0 members

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