expo-camera keep front facing photo mirrored?

Question

I am using the expo-camera library to take a selfie image. The preview is mirrored but the saved image is reverted to the normal orientation. How do I prevent this effect from happening (I want the image to stay mirrored), or if I can't, how can I flip my image horizontally?

Here's what I have so far for taking pictures:

const takePic = async () => {
  if (cameraRef) {
    const photo = await cameraRef.current.takePictureAsync();
    setFrontProfile(photo.uri);
  }
};

Answer 1

Use ImageManipulator to flip it.

Answer 2

I know this was already answered by @Kartikey but I wanted to offer a direct answer to the authors question.

The example in the link @Kartikey gave had the rotation set to 90 not 180. My answer checks if the photo was from the front camera before applying the manipulation, and fits right into the given code nice and clean.

import { manipulateAsync, FlipType, SaveFormat } from 'expo-image-manipulator';

...

const takePic = async () => {
    if (!cameraRef) return;
    
    let photo = await cameraRef.takePictureAsync();

    if (cameraType === Camera.Constants.Type.front) {
        photo = await manipulateAsync(
            photo.localUri || photo.uri,
            [
                { rotate: 180 },
                { flip: FlipType.Vertical },
            ],
            { compress: 1, format: SaveFormat.PNG }
        );
    }

    setFrontProfile(photo.uri);
};