c# - 如何将新的 Canvas ui 图像位置转换为 linerenderer 位置？

Question

我在具有屏幕空间 - 相机渲染模式的 Canvas 中有一个图像 UI。我喜欢做的是通过遍历所有 LineRenderer 位置并更改其 y 轴，将我的 LineRenderer 移动到图像垂直位置。我的问题是我无法获得 LineRenderer 可以理解的图像的正确位置。我试过使用 ViewportToWorldPoint 和 ScreenToWorldPoint 但位置不一样。

    Vector3 val = Camera.main.ViewportToWorldPoint(new Vector3(image.transform.position.x, image.transform.position.y, Camera.main.nearClipPlane));

    for (int i = 0; i < newListOfPoints.Count; i++)
    {
        line.SetPosition(i, new Vector3(newListOfPoints[i].x, val.y, newListOfPoints[i].z));
    }

截图结果使用 Vector3 val = Camera.main.ScreenToWorldPoint(new Vector3(image.transform.localPosition.x, image.transform.localPosition.y, -10));

绿色的LineRenderer是改变y位置的结果。它应该在正方形图像的底部。

Answer 1

哇，这既烦人又复杂。

这是我最终得到的代码。您问题中的代码是 Update() 函数的下半部分。我唯一改变的是传递给 ScreenToWorldPoint() 方法的内容。该值在 Update() 函数的上半部分计算。

RectTransformToScreenSpace() 函数改编自 this Unity Answer post¹ 关于获取 RectTransform 的屏幕空间坐标(这正是我们想要的，以便将屏幕空间坐标转换回世界空间!)唯一的区别是我得到了相反的 Y 值，所以我从 Screen.height - transform.position.y 更改为 transform.position.y，这完美地完成了这个技巧。

之后，只需捕获该矩形的左下角，使其成为 Vector3 而不是 Vector2，然后将其传回 ScreenToWorldPoint()。唯一的技巧那里是因为透视相机，我需要知道多远线最初与相机保持相同的距离(否则线比图像更快地在屏幕上上下移动)。对于正交相机，此值可以是任何值。

void Update () {
    //the new bits:
    float dist = (Camera.main.transform.position - newListOfPoints[0]).magnitude;
    Rect r = RectTransformToScreenSpace((RectTransform)image.transform);
    Vector3 v3 = new Vector3(r.xMin, r.yMin, dist);

    //more or less original code:
    Vector3 val = Camera.main.ScreenToWorldPoint(v3);
    for(int i = 0; i < newListOfPoints.Count; i++) {
        line.SetPosition(i, new Vector3(newListOfPoints[i].x, val.y, newListOfPoints[i].z));
    }
}

//helper function:
public static Rect RectTransformToScreenSpace(RectTransform transform) {
    Vector2 size = Vector2.Scale(transform.rect.size, transform.lossyScale);
    Rect rect = new Rect(transform.position.x, transform.position.y, size.x, size.y);
    rect.x -= (transform.pivot.x * size.x);
    rect.y -= ((1.0f - transform.pivot.y) * size.y);
    return rect;
}

¹并且从关于“如何获取 UI 对象的屏幕坐标”的一般搜索中找到那个帖子并不容易。出现了一堆其他帖子并提供了一些代码，但没有一个能达到我想要的效果(包括将屏幕空间坐标转换回 UI 对象的世界空间坐标，这很简单而且不可逆，谢谢 RectTransformUtility !)