How to flip sprite horizontally in Unity 2D?

Questions & Answers
, , , ,
1

I posted a question a few days ago, but haven’t received any responses. I thought I would rephrase my question in hopes of getting some better feedback.

I’m trying to understand my options for flipping sprites horizontally in Unity 2D (specifically version 5.0+). From what I know, there are two main options:

  1. Create sprites for facing right and facing left and switch between them as needed
  2. Create a single sprite for facing one direction and multiply the transform’s localScale by -1 whenever you want to mirror the image

I was using option #2 in Unity 4.X without any problems, but when I upgraded my project to unity 5.0, modifying the localScale made my sprite disappear. Any ideas why that might be the case? Please see the code in question below. If anyone has some efficient alternatives, please let me know.

// Flip sprite / animation over the x-axis
protected void Flip()    
{
   isFacingRight = !isFacingRight;
 
   Vector3 theScale = transform.localScale;
   theScale.x *= -1;
   transform.localScale = theScale;
 
   // Flip collider over the x-axis
   center.x = -center.x;
}
3

This is an old question, but it comes up frequently in a Google search, so I thought I’d point out the new answer:

As of Unity Unity-5-3, there is built-in “Flip” support. Just check whether you want to flip by X, Y, or both.

Sprite Renderer inspector

2D_SpriteRenderer_1

In code, you would just assign true/false to spriteRenderer.flipX and .flipY.

2

I think the “proper” method here would be to use localRotation (assuming 2D here right?) and a Quaternion and flip back and forth as needed… Just my quick example but I’m sure you could see how to adapt it. I still don’t fully understand Quaternion’s haha! But this should do the trick for you:

if (move < 0)
{
    m_FacingRight = false;
    transform.localRotation = Quaternion.Euler(0, 180, 0);
}
else
{
    m_FacingRight = true;
    transform.localRotation = Quaternion.Euler(0, 0, 0);
}

Hope that helps!

4

This is quick but another way to flip is changing the local x scale to -1

if (move < 0)
{
    m_FacingRight = false;
    transform.localxscale  = -1;
}

This should work i believe i have used this method before.

5

I don’t think modifying the transform is right. Keep both visual logic and game logic as separated as possible at all times.

Just ask the sprite renderer to do this and don’t mess with the scale, it will probably backfire

6

just set -1 in the scale x of the sprite of image UI if you want to get “mirrored image UI” without create new one in photoshop. hope this helpful…

10

I tried setting the bool variable flipX and flipY but the problem is that the colliders would not flip along with the sprites. This problem would make sense when you use a collider instead of just wrapping it around the character and for something else like wall detection (on collision) in the case of enemy patrolling or when no ground is detected (collision exit case).

if you want to flip the sprite along with the collider then this one worked for me:

transform.localScale = new Vector2(
    -transform.localScale.x ,
    transform.localScale.y
);

here, you just flip the scale of the sprite on the x-axis and keep the y-axis as it is.
Hope this would help someone.

7 
Vector3 Lscale = transform.localScale;
If (move > 0) Lscale.x = 1;
If (move < 0) Lscale.x = -1;
Transform.localScale = Lscale;

@bpioske

8 
void Update()
{
    float mov_x = Input.GetAxis("Horizontal");
    float Jump_y = Input.GetAxis("Vertical");
    Vector2 movForce = new Vector2(mov_x, 0) * speed ;
    rb2d.AddForce(movForce*Time.deltaTime);
    sprite.flipX = mov_x < 0;
}
9

@bpioske Maybe this would help.

SpriteRenderer spriteRenderer;

void Start()
{
    spriteRenderer = GetComponent<SpriteRenderer>();
    FlipSprite();
}

void FlipSprite()
{ 
    if (move < 0) 
    {
        spriteRenderer.flipX = true;
        //This is based that your sprite is facing which way 
    }
    else if (move > 0)
    {  
        spriteRenderer.flipX = false;
        //Hope this would help
    }
}
13

I’ve got a blog post on how to flip a sprite with a lerp to get a paper flip effect: