在UGUI - Scroll View中显示Sprite的技巧

在UI显示Sprite的两种方法

1. 使用一个独立摄像机，将Sprite读入可视范围里，渲染成Render Texture， 再将Render Texture于UI中的Sprite绑定

2. 在Canvas中使用Screen Space - Camera 模式，将Sprite挂在一个具有RectTransform的根节点下面，作为一个UI单位

方法1 ，是很多项目中常用的，在此不再赘述，但是有诸多问题并且实现方法繁琐，是舍近求远的做法，所以我们用方法2来实现

方法2中遇到的问题

Scroll View中图片是可以被拖动的，并且有个显示范围，直接拖动，会将图片显示到范围外面

Sprite会显示到背景框区域外面

解决方案：使用Sprite Mask

步骤：

1. 设置Sprite的Mask Interaction 为Visible Inside Mask

2. 添加Sprite Mask

3. 设置Sprite Mask的Custom Range

此处用的UIMask是Unity默认的透明图片，建议自己做个会比较好

4. 调整Sprite Mask的大小 - 调整Scale值

橘红色圈住的范围就是Sprite可显示的范围

5. 适配不同屏幕比例

只要 Canvas Scalar中的 Reference Pixel Per Unit 与Texture设定中的Sprite Mode/Pixel Per Unit 一致，之前设定过的Scale值就会通过UGUI自动适应不同的屏幕比例

运行结果：

SpriteMask内的Sprite不会再溢出了