【亮亮笔记】UGUI之CanvasScaler的正确用法及UGUI做通用屏幕自适应的解决方案

如果你使用Unity自带的UI系统去创建一个UI控件时，Unity会默认的创建Canvas和EventSystem，那么这二个控件有什么作用的，一起来看看！

    Canvas

Canvas 是其他所有 UI 对象的根。在一个场景里 Canvas 数量和层级都没有限制。子 Canvas 使用与父 Canvas 相同的渲染模式。一个 Canvas 有三种渲染模式：

Screen Space - Overlay：UI元素相对于屏幕空间，以2D方式显示在任何相机画面的上面。这是非常标准的 UI 风格。典型例子：大量窗口、文本和按钮的策略游戏，也是Unity的UI相机默认的渲染模式。

Screen Space - Camera：UI元素相对于屏幕空间，由指定的相机负责显示，相机的参数影响显示的结果。你可以把 Canvas 理解为相机的子物体。典型例子：射击游戏屏幕上的 3D HUD。

World Space：UI元素相对于世界空间，和其他场景里的物体一样有世界位置、遮挡关系。通常用来做非常创新的 UI 设计。例子：游戏内的手机屏幕、与场景绑定的游戏指导等。

EventSystem

如果你使用 UI 系统，那么 EventSystem 对象会自动创建。这个对象负责监听用户输入。默认情况下，在电脑上可以使用键盘和鼠标输入，在移动设备上可以使用触摸输入。但是如果你要为surface这样的设备开发，你也可以同时启用两种输入。当需要屏蔽用户输入时，将此对象关闭即可。UnityEngine.EventSystems.EventSystem.current 保存了当前活动的 EventSystem 对象。

CanvasScaler

这个组件负责屏幕适配。UI 系统使用 RectTransform 来计算 UI 的位置和大小，但这还不够。如何让设计的 UI 可以适配不同的分辨率、宽高比和 DPI？这个组件给出了以下3种适配方法，注意任何一种适配方法都不会改变UI的宽高比和相对定位。

Constant Pixel Size：通过调节 Canvas 像素大小来维持缩放不变。它的意思是不根据屏幕分辨率调整 Canvas 的缩放系数，而是调节 Canvas 的像素大小总是与屏幕保持一致。你可以手动或通过代码调节 Canvas 的缩放系数。这是 UI 系统默认的适配方案。如下图两种分辨率下相同的UI显示的不同之处，虽然不同屏幕下UI元素定位、大小没有发生变化（图中两个白色元素定位分别为屏幕左上角和右下角），但是较小的屏幕上UI元素占用了大部分屏幕空间，显得更拥挤。这就是这种适配方式的缺点，小屏幕太拥挤、大屏幕太空旷，没有考虑到屏幕的分辨率和DPI。但是这种模式的好处是UI元素可以保持设计时的细节（因为没有缩放）。这种模式可能适用于：你希望UI在一定范围内按原始大小显示，这样既可以让UI显示的尽可能清晰、又可以让屏幕较大的玩家拥有更广阔的视野，但是在太小或太大的屏幕上，你可以通过程序来调节缩放系数，不至于小屏幕被UI占满、大屏幕找不到UI。

Scale With Screen Size：根据屏幕分辨率缩放。这可能是大部分游戏最方便的适配方法。在这种模式下，你需要指定一种设计分辨率，然后指定缩放的算法。无论哪种缩放算法，如果实际宽高比与设计宽高比相同，UI 都会被等比缩放。实际上，Canvas 只是保持自己的大小和设计分辨率一致。如果实际宽高比与设计宽高比不同，这时缩放算法才会影响显示结果。缩放算法有三种：扩展、收缩 和 匹配宽高。扩展算法的逻辑是，扩大 Canvas （在宽高比上）较短的一边，使得 Canvas 宽高比与屏幕一致。如下左图，设计分辨率宽高比为1：1（红色线框），实际屏幕更宽所以 Canvas 的 width 增加以匹配屏幕。这样的算法在宽高比不同的屏幕上将始终导致UI更“开阔”。收缩算法的逻辑是，收缩 Canvas （在宽高比上）较长的一边，使得 Canvas 宽高比与屏幕一致。如下中图，设计分辨率宽高比为1：1（红色线框），实际屏幕更窄所以 Canvas 的 height 减小以匹配屏幕。这样的算法在宽高比不同的屏幕上将始终导致UI更“紧凑”。匹配宽高的算法逻辑是，根据指定的权重，同时调节 Canvas 的宽和高，使得 Canvas 宽高比与屏幕一致。如下右图，设计分辨率为红色线框，设定宽度和高度的权重相等（0.5），实际屏幕上 Canvas 的宽和高都被调整以匹配屏幕。这样的算法在宽高比不同的屏幕上根据宽高权重的不同UI布局“保真度”也不同。

Constant Physical Size：通过调节 Canvas 物理大小来维持缩放不变。它的意思是不根据屏幕物理大小调整 Canvas 的 DPI，而是调节 Canvas 的物理大小总是与屏幕保持一致。这种说法可能比 Constant Pixel Size 更难以理解，实际上他们本质是一样的，只不过  Constant Pixel Size 通过逻辑像素大小调节来维持缩放，而 Constant Physical Size 通过物理大小调节来维持缩放。使用这种模式必须指定一个像素转换物理大小的因数（填写96方便在windows上进行开发）。运行时通过具体设备报告的dpi计算最终的 Canvas 像素大小和缩放比例。这种模式从设计的意图来看，是为了适应某些超高dpi的显示设备（比如现在的 mac 高达 5K 的显示器），但是在我看来只不过是让开发人员更加困惑，实际使用价值并不高。因为开发人员更关心设计分辨率，他们需要绘制明确尺寸的图片！除非未来开发人员和玩家都使用了超高dpi的显示器，才会开始忽略像素尺寸而仅专注于物理尺寸。

而Graphic Raycaster在这里就不做介绍了，以后用到再做讨论； 重点说一下Reference Resolution和Match的设置：Reference Resolution的尺寸由你当前进行开发UI界面的设备决定的，比如：你在pc端做UI界面的开发，你电脑屏幕的1920X1080的分辨率，那么这里的Reference Resolution也要写为1920X1080，跟实际发布的目标设备的尺寸没有关系。Math的设置呢，你只要记住横版游戏以高度缩放，竖版游戏按宽度缩放，更通俗一点就是横版游戏拖到最左边，竖版游戏拖到最右边。有童鞋提到过Screen Match Mode可以使用Expand，但是经过测试发现，貌似在某些移动设备上会出现InputField响应区域偏离的Bug，
原因不明，所以建议使用Match Width Or Height。