UGUI ScrollView可拖动视图

首先我们建一个Image,以此为基础来建一个ScrollView
我们需要在Image上边添加组件ScrollRect,然后再加一个Mask

UGUI ScrollView可拖动视图_第1张图片
Paste_Image.png

然后 我们在该物体下方再建一个Image,然后给这个物体加上GridLayoutGroup

UGUI ScrollView可拖动视图_第2张图片
Paste_Image.png

我们这个Grid可以控制一行最多显示个数,还有这个Grid最大面积。然后我们再进行最后一步设置

UGUI ScrollView可拖动视图_第3张图片

然后我们在Grid下放放一行的UI元素,我们就可是实现拖动了。


UGUI ScrollView可拖动视图_第4张图片

接着我们给他加上一个ScrollBar,我们新建一个Image作为滚动条的背景图,然后再在他下边新建一个Image,然后锚点设置为

UGUI ScrollView可拖动视图_第5张图片
Paste_Image.png

然后加一个ScrollBar组件,然后修改下设置

UGUI ScrollView可拖动视图_第6张图片
Paste_Image.png

最后一步

UGUI ScrollView可拖动视图_第7张图片
Paste_Image.png

然后这样就可以了

若水GIF截图_2017年2月21日10点9分23秒.gif

ScrollRect

http://www.mamicode.com/info-detail-1166981.html我在网上找到这个作者写的还挺清楚的

你可能感兴趣的:(UGUI ScrollView可拖动视图)