使用Expo Camera设置4:3拍照比例及跨设备适配问题

核心问题分析 #

你遇到的问题本质是竖屏拍摄时的照片方向元数据未正确处理，加上设备相机硬件对ratio/pictureSize参数的限制，导致手动设置后比例仍不符合预期。

适配方案步骤 #

1. 从可用尺寸中筛选4:3比例选项 #

遍历getAvailablePictureSizesAsync返回的列表，精准筛选出符合4:3比例的尺寸（跳过"Photo"/"High"这类模糊预设）：

// 筛选4:3比例的尺寸
const filter4_3Sizes = (availableSizes) => {
  return availableSizes.filter(size => {
    if (!size.includes('x')) return false;
    const [w, h] = size.split('x').map(Number);
    const ratio = Math.max(w, h) / Math.min(w, h);
    // 允许微小浮点误差
    return Math.abs(ratio - 4/3) < 0.01;
  });
};

// 获取并选择最优尺寸
const availableSizes = await Camera.getAvailablePictureSizesAsync('wide-angle-camera');
const fourThirdSizes = filter4_3Sizes(availableSizes);
// 优先选分辨率最高的4:3尺寸，无则降级到Photo预设
const selectedSize = fourThirdSizes.length > 0 
  ? fourThirdSizes.sort((a, b) => {
      const [w1, h1] = a.split('x').map(Number);
      const [w2, h2] = b.split('x').map(Number);
      return (w2 * h2) - (w1 * h1);
    })[0]
  : 'Photo';

你的可用列表中，640x480是唯一符合4:3比例的尺寸，会被优先选中。

2. 处理照片方向修正 #

竖屏拍摄时，相机传感器通常为横置，照片会携带Exif方向标记，但部分设备不会自动解析旋转，导致显示比例异常。用expo-image-manipulator手动修正：

import { ImageManipulator } from 'expo-image-manipulator';

const takePhoto = async () => {
  if (!cameraRef.current) return;
  const rawPhoto = await cameraRef.current.takePictureAsync({
    pictureSize: selectedSize,
    quality: 0.8,
  });
  // 根据Exif信息旋转照片到正确方向
  const correctedPhoto = await ImageManipulator.manipulateAsync(
    rawPhoto.uri,
    [{ rotate: rawPhoto.exif.Orientation || 0 }],
    { format: 'jpeg' }
  );
  // 使用correctedPhoto.uri作为最终照片资源
};

3. 跨设备一致性保障 #

• 禁用High/Medium/Low这类预设：不同厂商设备对这些预设的定义差异极大，无法保证比例统一。
• 若用Photo作为降级选项，需在多设备验证：大部分iOS设备的Photo预设为4:3，但部分安卓设备可能是16:9，需提前测试。
• 同时设置ratio和pictureSize：部分设备需要双重参数约束才能生效：

  <CameraView
    ref={cameraRef}
    style={styles.camera}
    ratio="4:3"
    pictureSize={selectedSize}
  />
  

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