Sign in to follow this  
khleug35

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

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.

Share this post


Link to post
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

Share this post


Link to post
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

Share this post


Link to post
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...
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.