Unity中实现滚动视图

最新推荐文章于 2025-05-25 09:16:38 发布

原创

最新推荐文章于 2025-05-25 09:16:38 发布 · 2.6k 阅读

10 ·

CC 4.0 BY-SA版权

文章标签：

#Unity #Scroll Rect #Scrollbar #Content Size Fitter

本文介绍了在Unity中利用Scroll Rect、Mask、Grid Layout Group和Content Size Fitter组件创建滚动视图的步骤，包括设置Scroll Area，配置Content，使用Grid Layout Group和Content Size Fitter进行内容自适应，添加Mask隐藏超出部分，以及实现Scrollbar滑动控制。

Unity中可以使用Scroll Rect，Mask，Grid Layout Group，Content Size Fitter这四个自带组件来实现滚动视图效果。
1.新建一个Image，改名为ScrollArea，作为滚动视图的区域，在该Image上添加组件Scroll Rect，我做的是左右方向的滑动，就把Vertical的对勾去掉了
在这里插入图片描述
2.在Scroll Area下新建一个Image，改名为Content，在该Image上添加组件Grid Layout Group，并调整相应参数，在该Image下新建多个Image，此时Content的大小并不会根据子物体的数量而改变。

3.在Content上新增组件Content Size Fitter，并把Horizontal Fit设置为Preferred Size(我做的是左右滑动，要根据实际情况来调整)，这时Content水平方向会根据子物体的数量来做自适应，自动调整大小；调整Content的Rect Transform，让Content和它的父物体ScrollArea的左边对齐
在这里插入图片描述
4.指定ScrollRect的Content为Content，就实现了滑动效果。然后再ScrollArea上新增组件mask，将ScrollArea区域外的部分隐藏掉。