React Native Vision Camera横向拍摄设置无效问题求助

当应用旋转锁定为纵向，即便给Camera组件设置了orientation='landscape-left'，拍摄后的照片仍保持纵向，核心原因是应用旋转锁定会限制相机输出的默认方向，且组件的orientation属性通常仅影响预览画面，不会直接修改照片的元数据与实际存储方向。以下是可行的解决步骤：

1. 拍摄后手动旋转照片 #

借助图片处理库（如expo-image-manipulator或@react-native-community/image-editor），在拍摄完成后主动将照片旋转至横向：

以expo环境为例，先安装依赖：

npx expo install expo-image-manipulator

修改takePhoto函数，添加旋转逻辑：

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

const takePhoto = async () => {
  if (camera.current) {
    const rawPhoto = await camera.current.takePhotoAsync();
    // 逆时针旋转90度，匹配landscape-left的横向需求
    const landscapePhoto = await manipulateAsync(
      rawPhoto.uri,
      [{ rotate: 90 }],
      { compress: 0.8, format: SaveFormat.JPEG }
    );
    // landscapePhoto.uri即为处理后的横向照片，可用于存储或展示
  }
};

2. 确认相机设备的方向支持 #

确保你获取的相机设备支持横向拍摄，可在初始化时校验：

const { device } = useCameraDevice('back');
if (device) {
  console.log('设备支持的拍摄方向:', device.supportedOrientations);
}

若设备不支持目标方向，可尝试切换前后相机或调整设备选择逻辑。

3. 修正照片EXIF方向标记 #

部分场景下，照片本身是横向存储，但EXIF中的方向标记导致展示时被自动转为纵向。可读取EXIF信息并修正：

import * as MediaLibrary from 'expo-media-library';

const fixPhotoOrientation = async (photoUri) => {
  const asset = await MediaLibrary.createAssetAsync(photoUri);
  const assetInfo = await MediaLibrary.getAssetInfoAsync(asset.id);
  // 若EXIF方向为6（代表需逆时针转90度），执行旋转处理
  if (assetInfo.exif.Orientation === 6) {
    const rotatedPhoto = await manipulateAsync(
      photoUri,
      [{ rotate: 90 }],
      { compress: 0.8 }
    );
    return rotatedPhoto.uri;
  }
  return photoUri;
};

内容的提问来源于stack exchange，提问作者Xacoio