U3D Scroll View制作

记录一个Scroll View的制作过程
效果图如下，一个简易的商城界面，能通过拖拽商品查看商品的功能，并实现屏幕不同分辨率下的自适应

在实现之前首先导入资源，在项目文件的Assets目录下添加所需的资源，在其中截图不适宜过大，所以各部分Rect Transform设置最后附上

1. 在Hierarchy中添加UI中Scroll View，以及本次制作组件全览
   
2. 以UI中Image作为背景，选择资源中的合适图片
   
3. Scroll View所需Component如图
   
4. Viewport控件设置如下
   这里要注意，自身最适大小必须设定，否则Unity会以Image原始大小设置，那就不能直视而且不能达到遮罩效果的实现了

5. 商品组的设置
在设置商品组时，可以先Create Empty，更名为NewStore01，来统一管理其中的小的商品资源商品组设置如下图

6. 商品组中的小商品设置为Button控件，可以点击，绑定相应操
里面的discount和Button都是组成小商品的资源，可以根据需求改造

7. 设置不同分辨率下的UI自适应，这里需要参考后面的附录，Rect Transform设置
设置Canvas Scaler中UI Scale Mode也就是UI控件在屏幕中的缩放模式，要配合各部件锚点设置，比如Button控件相对于父节点的锚点可以放在离自己最近的角，这里我设置的锚点在附录里，而模式如下图

附录：
Scroll View的Rect Transform设置

锚点设置为铺满，方便控制自身在背景画布中的位置

Viewport

NewStore01组锚点可设置为左上角，在拖拽小商品组时根据锚点移动