Sprite Mirroring

[butternyke]

How can I make a sprite flip its x-axis when it’s on different sides of an axis, or when it’s on a different side of an entity?

https://playcanvas.com/project/1065819/overview/euprecurserbossexe

[Leonidas]

Hi @butternyke,

You can set the scale to a negative value on that axis, that will flip the sprite. Here I set it to 1, -1, 1 (flipped on Y):

[butternyke]

Thanks, but I wish to know how I can make it flip itself when it crosses an axis, specifically the z-axis, essentially like this:

On the left is how it usually looks, and on the right is the flipped version. The blue line is the z-axis.

[Leonidas]

Well, if you know the exact position on that axis (e.g. X), you can use some code like this:

// e.g. in your update method
if(this.entity.getPosition().x <= 0){
   this.entity.setLocalScale(1, 1, -1);
}else{
   this.entity.setLocalScale(1, 1, 1);
}

Just find/play with the right axis until you get it.

[butternyke]

I may need to be a bit more specific. I simply want to toggle the “Flip X” part of the sprite component when it passes over the z-axis.