在 WorldSpace Canvas 上使用覆盖 Canvas 上的 RectTransform 裁剪图像纹理

Question

几天来我一直在尝试在 WorldSpace Canvas 上使用 RectTransform(CropArea - 代码示例中的 cropArea) 在 Overlay Canvas.

问题是我在原图上找不到cropArea的正确坐标。

我试过这个：

        Texture2D croppedTexture = new Texture2D((int)cropArea.rectTransform.rect.width, (int)cropArea.rectTransform.rect.height);
        Texture2D originalTexture = (Texture2D) originalImage.mainTexture;
        
        croppedTexture.SetPixels(originalTexture.GetPixels((int)cropArea.rectTransform.anchoredPosition.x, (int)cropArea.rectTransform.anchoredPosition.y, (int)cropArea.rectTransform.rect.width, (int)cropArea.rectTransform.rect.height));
        croppedTexture.Apply();
        resultImage.texture = croppedTexture;

但是结果图像没有正确裁剪。有点偏左，有点偏下。

有人知道我该如何实现吗？

Answer 1

我发现我必须考虑这么多变数。这是一个简化版本。

需要一个新字段：worldCanvas

var cropRectTrans = cropArea.rectTransform;
var origRectTrans = originalImage.rectTransform;
var origRectSize = origRectTrans.sizeDelta;
var pivot = origRectTrans.pivot;
Texture2D originalTexture = (Texture2D)originalImage.mainTexture;

// Scale pivot to pixel unit.

pivot.Scale(origRectSize);

// Get corners of the overlay rectangle in world space.
// The canvas is "Screen Space Overlay", so these positions are
// also the screen positions.

var cropCorners = new Vector3[4];
cropRectTrans.GetWorldCorners(cropCorners);

// Transform the left-bottom and right-top corners to the space
// of the original image. The translated position needs to be added
// with the scaled pivot, so that we can obtain the coordinates
// relative to the left-bottom corner of the image.

var cam = worldCanvas.worldCamera;
RectTransformUtility.ScreenPointToLocalPointInRectangle(
    origRectTrans, cropCorners[0], cam, out Vector2 lb);
RectTransformUtility.ScreenPointToLocalPointInRectangle(
    origRectTrans, cropCorners[2], cam, out Vector2 tr);

var point = lb + pivot;
var size = tr - lb;

// Scale the position and size if the image is scaled.

var scale = new Vector2(
    originalTexture.width / origRectSize.x,
    originalTexture.height / origRectSize.y
);
point.Scale(scale);
size.Scale(scale);

// Finally we get the correct position and size in the original image space.

Texture2D croppedTexture = new Texture2D((int)size.x, (int)size.y);
croppedTexture.SetPixels(originalTexture.GetPixels(
    (int)point.x, (int)point.y, (int)size.x, (int)size.y));
croppedTexture.Apply();
resultImage.texture = croppedTexture;

在 WorldSpace Canvas 上使用覆盖 Canvas 上的 RectTransform 裁剪图像纹理

Crop Image texture on WorldSpace Canvas using RectTransform on Overlay Canvas

unity3d

canvas

texture2d