Apple Vision API实时预览：文档检测坐标对齐问题求助

核心问题是Vision返回的归一化坐标与AVCaptureVideoPreviewLayer的显示坐标空间不匹配，尤其是设置videoGravity = .resizeAspectFill时，预览层会对画面进行缩放裁剪，直接按尺寸缩放必然导致错位。以下是精准解决方案：

关键修改步骤 #

1. 替换坐标转换逻辑 #

修改drawRectangle方法，使用AVCaptureVideoPreviewLayer提供的官方转换方法，自动处理缩放、裁剪和方向适配：

private func drawRectangle(_ rectangle: VNRectangleObservation, inBounds: CGRect) {
    // 转换Vision归一化边界到图像像素坐标
    let metadataRect = VNImageRectForNormalizedRect(rectangle.boundingBox, Int(inBounds.width), Int(inBounds.height))
    
    // 转换metadata坐标到预览层坐标空间
    let previewRect = videoPreviewLayer.layerRectConverted(fromMetadataOutputRect: metadataRect)
    
    // 封装顶点坐标转换逻辑
    func convertPoint(_ visionPoint: CGPoint) -> CGPoint {
        // 归一化点转图像像素点（Vision原点在左下角，需反转Y轴）
        let imagePoint = CGPoint(x: visionPoint.x * inBounds.width, y: (1 - visionPoint.y) * inBounds.height)
        // 转metadata输出坐标（原点在左上角）
        let metadataPoint = CGPoint(x: imagePoint.x, y: inBounds.height - imagePoint.y)
        // 最终转预览层坐标
        return videoPreviewLayer.layerPointConverted(fromMetadataOutputPoint: metadataPoint)
    }
    
    // 转换四个顶点
    let topLeft = convertPoint(rectangle.topLeft)
    let topRight = convertPoint(rectangle.topRight)
    let bottomLeft = convertPoint(rectangle.bottomLeft)
    let bottomRight = convertPoint(rectangle.bottomRight)
    
    // 绘制路径
    let path = UIBezierPath()
    path.move(to: topLeft)
    path.addLine(to: topRight)
    path.addLine(to: bottomRight)
    path.addLine(to: bottomLeft)
    path.close()
    
    documentOverlayLayer.path = path.cgPath
}

2. 同步图层布局 #

添加viewDidLayoutSubviews方法，确保屏幕旋转或尺寸变化时，预览层和覆盖层的frame同步更新：

override func viewDidLayoutSubviews() {
    super.viewDidLayoutSubviews()
    videoPreviewLayer.frame = view.layer.bounds
    documentOverlayLayer.frame = videoPreviewLayer.bounds
}

3. 确保方向转换正确 #

如果你的exifOrientationFromDeviceOrientation方法存在问题，使用以下标准实现：

private func exifOrientationFromDeviceOrientation() -> CGImagePropertyOrientation {
    switch UIDevice.current.orientation {
    case .portraitUpsideDown: return .left
    case .landscapeLeft: return .upMirrored
    case .landscapeRight: return .down
    case .portrait: return .right
    default: return .right
    }
}

原理说明 #

• Vision API返回的坐标是归一化坐标，原点在图像左下角，x轴向右，y轴向上。
• AVCaptureMetadataOutput的坐标空间原点在图像左上角，与UIKit坐标系一致。
• layerRectConverted(fromMetadataOutputRect:)和layerPointConverted(fromMetadataOutputPoint:)会自动处理videoGravity的缩放裁剪逻辑，无论设备方向、捕获预设如何变化，都能保证坐标精准映射到预览层。

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