在Android AR Foundation中实现Unity XrCpuImage坐标到视口坐标的转换

我之前也踩过完全一样的坑！明明OpenCV那边检测到的纸边坐标分毫不差，一转到Unity里画框就缩成了小不点，折腾了好半天才搞明白是坐标系统和适配缩放的问题没处理好。

核心问题其实是XrCpuImage的像素坐标系和Unity的屏幕坐标系完全不是一回事，而且AR Foundation的相机预览画面还会根据设备屏幕做宽高比适配，直接硬转肯定会出错。下面给你一步步拆解解决方法：

先搞懂两个坐标系的核心差异 #

• XrCpuImage的坐标原点在左上角，Y轴是向上增长的；而Unity的屏幕坐标原点在左下角，Y轴向下增长，这是第一个必须修正的点。
• XrCpuImage的分辨率是相机原始捕获的分辨率（比如1920×1080），但Unity的屏幕分辨率是设备的显示分辨率（比如2340×1080），而且AR Foundation会自动做宽高比适配（默认是Aspect Fit模式，保证预览画面完整显示），这就导致预览画面可能带黑边，不能直接按比例硬缩。

具体转换步骤 #

1. 先获取关键参数 #

你需要从OpenCV插件里拿到XrCpuImage的原始宽高（imageWidth、imageHeight），同时获取Unity当前的Screen.width和Screen.height。

2. 计算适配缩放比例与偏移 #

AR Foundation默认用Aspect Fit模式显示预览画面，得根据宽高比的差异计算正确的缩放比例和黑边偏移：

• 先算两个宽高比：预览画面比 = (float)imageWidth / imageHeight，屏幕比 = (float)Screen.width / Screen.height
  • 如果预览画面比 > 屏幕比：说明预览画面更宽，屏幕上下会出现黑边。这时候要让预览画面的宽度充满屏幕，缩放比例取Screen.width / imageWidth，同时计算垂直方向的偏移（用来抵消上下黑边）：offsetY = (Screen.height - imageHeight * scale) / 2f
  • 如果预览画面比 ≤ 屏幕比：说明预览画面更高，屏幕左右会出现黑边。这时候要让预览画面的高度充满屏幕，缩放比例取Screen.height / imageHeight，同时计算水平方向的偏移（抵消左右黑边）：offsetX = (Screen.width - imageWidth * scale) / 2f

3. 坐标翻转与转换 #

对每个从OpenCV拿到的纸角坐标（比如(x, y)），按下面的规则转成Unity屏幕坐标：

• 先翻转Y轴：因为XrCpuImage的Y轴向上，Unity的Y轴向下，所以flippedY = imageHeight - y
• 再用刚才算的缩放比例和偏移计算最终屏幕坐标：
  screenX = x * scale + offsetX
screenY = flippedY * scale + offsetY

给你个现成的代码片段参考 #

// 假设从OpenCV插件拿到的原始图像分辨率和检测到的纸角坐标
int imageWidth = 1920;
int imageHeight = 1080;
List<Vector2> detectedImageCorners = new List<Vector2>(); // 你的检测结果
List<Vector2> screenCorners = new List<Vector2>();

// 计算适配参数
float previewAspect = (float)imageWidth / imageHeight;
float screenAspect = (float)Screen.width / Screen.height;
float scale = 1f;
float offsetX = 0f;
float offsetY = 0f;

if (previewAspect > screenAspect)
{
    // 预览更宽，按屏幕宽度缩放，上下补黑边
    scale = Screen.width / (float)imageWidth;
    offsetY = (Screen.height - imageHeight * scale) / 2f;
}
else
{
    // 预览更高，按屏幕高度缩放，左右补黑边
    scale = Screen.height / (float)imageHeight;
    offsetX = (Screen.width - imageWidth * scale) / 2f;
}

// 批量转换每个纸角坐标
foreach (var corner in detectedImageCorners)
{
    float flippedY = imageHeight - corner.y;
    float screenX = corner.x * scale + offsetX;
    float screenY = flippedY * scale + offsetY;
    screenCorners.Add(new Vector2(screenX, screenY));
}

// 之后用screenCorners里的坐标绘制你的蓝色矩形就可以了

额外要注意的坑 #

• 一定要确保从OpenCV拿到的坐标是XrCpuImage的原始分辨率，别用经过压缩或裁剪后的尺寸，不然缩放比例肯定错。
• 调试的时候可以用Debug.Log输出转换前后的坐标值，比如把原始X=1920（纸的右边缘）转成屏幕坐标后，应该等于Screen.width - offsetX，这样就能验证缩放比例对不对了。

按这个方法调完，你那个蓝色框应该就能精准贴在纸的边缘了，我当时就是这么解决的！

内容来源于stack exchange