Unity新UI：GUI.DrawTexture ScaleAndCrop等效

Question

我想用Unity（2D）实现一个图库。我有Canvas逻辑上划分为100x100单位的正方形。然后：

• 每个“square”由动态下载的图像填充 互联网（使用www类）;
• 图像不一定是正方形：在这种情况下，我想“缩放并裁剪图像”：保留纵横比，图像填满整个正方形;
• 当用户点击正方形时，图像会扩展到其自然大小 屏幕中间。再次单击图像会返回到 方形尺寸/位置;
• 定期拍摄正方形 随机地将其图像替换为新图像。

我是Unity的新手，我已经尝试了很多不同的方法。我真正的问题是规模和作物。事实上：

• Gui.DrawTexture()接受参数scaleMode.ScaleAndCrop，这正是我所需要的。但这是旧UI系统的一部分......
• 新用户界面提供Image和RawImage Gui组件，但开箱即用，我们可以保持宽高比或填充广场，而不是两者。
• 我试图通过将一个像素的正方形复制到一个新的纹理来创建一个“纹理缩略图”。它有效，但缩略图和全尺寸图像之间的动画不再可能......

我确信有一种方法可以使用新的UI功能和获得缩放和裁剪效果，但我无法弄清楚如何。有人会对我有建议吗？

Answer 1

您将需要使用Image组件缩放GameObject，并使用Mask组件。

我会这样做：

使用GridLayoutGroup创建画布，可以根据需要组织缩略图图像（3行3列等）。

每个图像都有一个带有掩码的父GameObject，它将使用GridLayoutGroup设置。面具之子将是一个图像，您将在其中显示下载的内容。

引用您选择的控制器中的每个Image组件。

image1是对第一个缩略图的引用;

下载图像时，将它的Sprite分配给image1.sprite。

调用image1.SetNativeSize（）;

检查fimage1.GetComponent＆lt; RectTransform＆gt;（）。sizeDelta（这是宽度和高度）并根据图像大小缩放image1，考虑使其适合遮罩边框。你基本上需要一些数学小算法。

image1还有一个带有OnClick事件的Button组件，它将触发let说“ShowImagePressed（Image img）”。参数是image1的图像。

触发此处理程序时，请通过image1.transform.parent.GetComponent＆lt; Mask＆gt;（）。enabled = false禁用遮罩，并缩放image1，将其移动到中心。

Answer 2

实现自动缩放和裁剪行为的最简单方法是在包含图像的GameObject中添加 AspectRatioFitter 。将 AspectMode 设置为信封父。这样Unity就会填充，如果需要，可以与父级重叠，请参阅Unity Documentation：

  

信封父级：自动调整宽度，高度，位置和锚点，使矩形覆盖父级的整个区域，同时保持宽高比。这个rec​​t可能比父矩形延伸得更远。

然后，您可以向父对象添加遮罩以隐藏不需要的叠加（不要忘记添加空图像，否则遮罩将无效）。您可能必须在脚本中处理的唯一事情是找到正确的图像宽高比。