UGUI ScrollView滑动制作

ScollView的滑动效果的制作,在游戏开发中还是比较重要的,但是有很多同学老是掌握不到技巧,导致老是出错,今天就来说一下ScrollView的制作方法。

首先看一下场景,创建了一个空节点,当作界面的父节点UGUI ScrollView滑动制作_第1张图片

然后继续创建空节点SV,SV的区域需要拉一下,大致为以后的滑动区域(显示物体区域),如图:

UGUI ScrollView滑动制作_第2张图片

继续创建空节点ScrollRect,区域如下

UGUI ScrollView滑动制作_第3张图片

右侧加入ScrollRect组件

UGUI ScrollView滑动制作_第4张图片

加入空节点ViewPort,区域大小和需要添加的组件如图:

UGUI ScrollView滑动制作_第5张图片

加入空节点Content,添加的组件如图

UGUI ScrollView滑动制作_第6张图片

接下来Item登场,先来看一下Item长什么样

UGUI ScrollView滑动制作_第7张图片

把Item多复制几个放入Content下面

UGUI ScrollView滑动制作_第8张图片

发现图片变成这个*样了,背景貌似被所短了。

接下来点击Content把GridLayoutGroup里面的CellSize尺寸调整一下,这个是控制每个Item的尺寸

UGUI ScrollView滑动制作_第9张图片

 

接下来调节这个参数:

UGUI ScrollView滑动制作_第10张图片

效果

UGUI ScrollView滑动制作_第11张图片

接下来调整GridLayoutGroup对应参数(这里如果是两列就填2)

UGUI ScrollView滑动制作_第12张图片

下图Spacing为每个Item之间的间隔

UGUI ScrollView滑动制作_第13张图片

接下来把对应的Content和ViewPort拖入相应位置

UGUI ScrollView滑动制作_第14张图片

最后把水平滑动取消,因为这个案例是垂直上下滑动

UGUI ScrollView滑动制作_第15张图片

最后就可以滑动啦

UGUI ScrollView滑动制作_第16张图片

由于时间有限,编写仓促,有问题的同学请与老师沟通。

你可能感兴趣的:(Unity)