UI 使用 Canvas 缩放器时元素未缩放
UI Elements not scaling while using Canvas Scaler
我正在尝试让我的 UI 元素工作并在每个不同的分辨率下保持相同。我在我的 Canvas 中添加了一个 Canvas 缩放器并尝试设置直到它看起来完成。
然后我尝试构建游戏并 运行 以几种不同的分辨率来确认它是否正常工作。但是,Canvas 缩放器似乎不起作用。
以上是一些 运行dom 分辨率,但这是我的编辑器屏幕的大小,也是我用作参考分辨率的分辨率。这也是此特定 Canvas http://prntscr.com/d1aggx 的层次结构。当 运行 分辨率为 640x480 时,它几乎占据了整个屏幕。我不知道为什么这不起作用。我已经阅读了大部分关于此的统一指南,但其中 none 似乎有这个问题。
好的,无论屏幕大小如何,要适应某些东西,您必须使用不同于 Unity 的绝对系统的单独坐标系。 Unity 的模型之一是视图。视图是左上角的坐标 0,0 和右下角的坐标 1,1。创建一个处理该问题的基本 Rect,如下所示。
using UnityEngine;
namespace SeaRisen.nGUI
{
public class RectAnchored
{
public float x, y, width, height;
public RectAnchored(float x, float y, float width, float height)
{
this.x = x;
this.y = y;
this.width = width;
this.height = height;
}
public static implicit operator Rect(RectAnchored r)
{
return new Rect
{
x = r.x * Screen.width,
y = r.y * Screen.height,
width = r.width * Screen.width,
height = r.height * Screen.height
};
}
}
}
在这里,我们采用普通的 Rect 浮点数、x、y 坐标以及宽度和高度。但是这些在值 [0..1] 中。我没有夹住它,所以如果需要的话,它可以用动画在屏幕上和屏幕外补间。
以下是一个简单的脚本,它在屏幕的右下角创建一个按钮,并随着屏幕的增大或缩小而调整大小。
void MoveMe()
{
RaycastHit hit;
if (Physics.Raycast(transform.position, -Vector3.up, out hit, float.MaxValue)
|| Physics.Raycast(transform.position, Vector3.up, out hit, float.MaxValue))
transform.position = hit.point + Vector3.up * 2;
}
void OnGUI()
{
if (GUI.Button(new RectAnchored(.9f, .9f, .1f, .1f), "Fix me"))
{
MoveMe();
}
}
X 向右 0.9,Y 向右 0.9,宽度和高度为 .1,因此按钮的高度和宽度为屏幕的 1/10,位于底部 1/屏幕的第 10 个。
由于 OnGUI 每帧(或左右)渲染一次,按钮矩形会随着屏幕大小自动调整而更新。如果您使用 Update() 来呈现您的 windows.
,那么这同样适用于典型的 UI
我希望这能解释我所说的绝对坐标之间的区别。在 640x480 中设置前面的示例(使用绝对值),它类似于 new Rect(576, 432, 64, 48)
并且不会缩放。通过使用 new RectAnchored(.9f, .9f, .1f, .1f)
并根据屏幕尺寸将其呈现为 UI space,然后它会自动缩放。
我正在尝试让我的 UI 元素工作并在每个不同的分辨率下保持相同。我在我的 Canvas 中添加了一个 Canvas 缩放器并尝试设置直到它看起来完成。
然后我尝试构建游戏并 运行 以几种不同的分辨率来确认它是否正常工作。但是,Canvas 缩放器似乎不起作用。
以上是一些 运行dom 分辨率,但这是我的编辑器屏幕的大小,也是我用作参考分辨率的分辨率。这也是此特定 Canvas http://prntscr.com/d1aggx 的层次结构。当 运行 分辨率为 640x480 时,它几乎占据了整个屏幕。我不知道为什么这不起作用。我已经阅读了大部分关于此的统一指南,但其中 none 似乎有这个问题。
好的,无论屏幕大小如何,要适应某些东西,您必须使用不同于 Unity 的绝对系统的单独坐标系。 Unity 的模型之一是视图。视图是左上角的坐标 0,0 和右下角的坐标 1,1。创建一个处理该问题的基本 Rect,如下所示。
using UnityEngine;
namespace SeaRisen.nGUI
{
public class RectAnchored
{
public float x, y, width, height;
public RectAnchored(float x, float y, float width, float height)
{
this.x = x;
this.y = y;
this.width = width;
this.height = height;
}
public static implicit operator Rect(RectAnchored r)
{
return new Rect
{
x = r.x * Screen.width,
y = r.y * Screen.height,
width = r.width * Screen.width,
height = r.height * Screen.height
};
}
}
}
在这里,我们采用普通的 Rect 浮点数、x、y 坐标以及宽度和高度。但是这些在值 [0..1] 中。我没有夹住它,所以如果需要的话,它可以用动画在屏幕上和屏幕外补间。
以下是一个简单的脚本,它在屏幕的右下角创建一个按钮,并随着屏幕的增大或缩小而调整大小。
void MoveMe()
{
RaycastHit hit;
if (Physics.Raycast(transform.position, -Vector3.up, out hit, float.MaxValue)
|| Physics.Raycast(transform.position, Vector3.up, out hit, float.MaxValue))
transform.position = hit.point + Vector3.up * 2;
}
void OnGUI()
{
if (GUI.Button(new RectAnchored(.9f, .9f, .1f, .1f), "Fix me"))
{
MoveMe();
}
}
X 向右 0.9,Y 向右 0.9,宽度和高度为 .1,因此按钮的高度和宽度为屏幕的 1/10,位于底部 1/屏幕的第 10 个。
由于 OnGUI 每帧(或左右)渲染一次,按钮矩形会随着屏幕大小自动调整而更新。如果您使用 Update() 来呈现您的 windows.
,那么这同样适用于典型的 UI我希望这能解释我所说的绝对坐标之间的区别。在 640x480 中设置前面的示例(使用绝对值),它类似于 new Rect(576, 432, 64, 48)
并且不会缩放。通过使用 new RectAnchored(.9f, .9f, .1f, .1f)
并根据屏幕尺寸将其呈现为 UI space,然后它会自动缩放。