Flutter集成iPhone相机插件拍照图像180度翻转问题解决方案咨询

这个问题我太熟悉了！之前做Flutter相机项目时，iOS端也遇到过一模一样的坑——明明锁了UI旋转，平放手机拍出来的照片还是180度翻转，Android却完全正常。给你几个亲测有效的解决思路：

1. 读取并修正照片的EXIF方向信息 #

iOS相机即使在UI锁定的情况下，也会把设备的物理方向记录到照片的EXIF元数据里，而Flutter默认不会自动根据这个信息旋转图片。我们可以手动读取EXIF的Orientation标签，然后对图片进行旋转修正。

可以用image包来实现这个功能，示例代码如下：

import 'package:image/image.dart' as img;
import 'dart:typed_data';

Future<Uint8List> fixImageOrientation(Uint8List imageBytes) async {
  final img.Image originalImage = img.decodeImage(imageBytes)!;
  // 读取EXIF数据
  final exifData = await img.readExifFromBytes(imageBytes);
  final orientationValue = exifData['Orientation']?.value;

  img.Image fixedImage;
  switch (orientationValue) {
    case 3: // 照片需要180度翻转
      fixedImage = img.flipVertical(img.flipHorizontal(originalImage));
      break;
    case 6: // 照片需要顺时针转90度
      fixedImage = img.copyRotate(originalImage, 90);
      break;
    case 8: // 照片需要逆时针转90度
      fixedImage = img.copyRotate(originalImage, -90);
      break;
    default: // 无需修正
      fixedImage = originalImage;
  }

  return Uint8List.fromList(img.encodeJpg(fixedImage));
}

调用这个方法处理拍照后的字节数据，就能得到方向正确的图片了。

2. 强制相机的捕捉方向 #

如果你用的是官方的camera插件，可以在初始化相机控制器时，强制指定相机的捕捉方向，忽略设备的平放状态。

示例代码：

import 'package:camera/camera.dart';

late CameraController _cameraController;

Future<void> initCamera() async {
  final cameras = await availableCameras();
  final targetCamera = cameras.firstWhere((camera) => camera.lensDirection == CameraLensDirection.back);
  
  _cameraController = CameraController(
    targetCamera,
    ResolutionPreset.medium,
    enableAudio: false,
    imageFormatGroup: ImageFormatGroup.jpeg,
  );

  // 强制设置相机捕捉方向为竖屏向上
  await _cameraController.setPreferredOrientation(DeviceOrientation.portraitUp);
  await _cameraController.initialize();
}

这个方法能让相机始终以固定方向捕捉画面，减少平放时的方向判定错误，但最好还是结合EXIF修正来兜底，避免极端情况。

3. 过滤设备的平放方向状态 #

iOS的设备方向检测在手机平放时会返回faceUp或faceDown，这时候相机可能会沿用之前的方向或者判定错误。我们可以监听设备方向，只记录有效的竖屏/横屏方向，在拍照时使用这个记录的方向来修正。

示例代码（通过WidgetsBindingObserver监听）：

import 'package:flutter/material.dart';
import 'package:camera/camera.dart';

class CameraPage extends StatefulWidget {
  const CameraPage({super.key});

  @override
  State<CameraPage> createState() => _CameraPageState();
}

class _CameraPageState extends State<CameraPage> with WidgetsBindingObserver {
  DeviceOrientation? _lastValidOrientation;
  late CameraController _cameraController;

  @override
  void initState() {
    super.initState();
    WidgetsBinding.instance.addObserver(this);
    // 初始化时记录当前有效方向
    _lastValidOrientation = WidgetsBinding.instance.window.orientation;
    _initCamera();
  }

  Future<void> _initCamera() async {
    final cameras = await availableCameras();
    _cameraController = CameraController(
      cameras.first,
      ResolutionPreset.medium,
      enableAudio: false,
    );
    await _cameraController.initialize();
  }

  @override
  void didChangeMetrics() {
    super.didChangeMetrics();
    final currentOrientation = WidgetsBinding.instance.window.orientation;
    // 只记录非平放的方向
    if (currentOrientation != DeviceOrientation.faceUp && currentOrientation != DeviceOrientation.faceDown) {
      setState(() {
        _lastValidOrientation = currentOrientation;
      });
    }
  }

  // 拍照前，可根据_lastValidOrientation调整相机方向
  Future<void> takePhoto() async {
    if (_lastValidOrientation != null) {
      await _cameraController.setPreferredOrientation(_lastValidOrientation!);
    }
    final image = await _cameraController.takePicture();
    // 后续用EXIF修正方法处理图片...
  }

  @override
  void dispose() {
    WidgetsBinding.instance.removeObserver(this);
    _cameraController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: _cameraController.value.isInitialized 
          ? CameraPreview(_cameraController)
          : const Center(child: CircularProgressIndicator()),
      floatingActionButton: FloatingActionButton(
        onPressed: takePhoto,
        child: const Icon(Icons.camera),
      ),
    );
  }
}

这三个方法结合起来，基本能解决iOS平放拍照的翻转问题。核心原因就是iOS和Android对相机方向的元数据处理逻辑不同，Android会自动修正，而iOS需要我们手动干预。

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