【UGUI】Scroll View的基本使用方法

最新推荐文章于 2025-07-16 15:43:45 发布
原创 最新推荐文章于 2025-07-16 15:43:45 发布 · 1.2w 阅读 · 8 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文介绍了Unity中UGUI Scroll View的使用方法，包括如何在有限空间内展示多个Toggle选项，以及如何实现文字页面的滚动。通过设置Scroll Rect组件、Content、Viewport和Scrollbar，调整Movement Type和Inertia等属性，实现舒适的滚动体验。当Content完全显示时，Scrollbar会自动隐藏。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

1.效果图

2.目标功能：

（1）在左侧有限空间内放置一系列的Toggle，滑动可以选择不同Toggle。

（2）滑动文字页面/滑动条，可以看到所有文字

3.实现工具：

   Scroll View (滚动视图，可在GameObject->UI->Scroll View处创建)

4.Scroll View解析：

（1）在Scroll View这个物体身上挂了Scroll Rect这个组件，其中已经自动指定了Content，Viewport，Vertical Scrollbar（如果自己给游戏物体添加Scroll Rect组件，要注意给这些属性赋值，其中Content和Viewport是必需的）。

（2）简单介绍一下这个组件的常用属性。因为使用滚动视图的原因是有限空间无法显示出足够的内容，所以制作时就要指定好两个部分：显示的有限空间，真正要显示的全部内容。

         真正要显示的全部内容就是Content部分。可以在Content上添加Layout组件（比如：Vertical Layout或Grid Layout等）来组织UI元素的排版。在编辑的时候会发现超出Scroll View边界的Content就看不到了。这是因为Viewport上有一个Mask组件，就是通过mask制定了“显示的有限空间”，可以直接改变Vi

最低0.47元/天 解锁文章

新学期VIP享超值加赠
UGUI交互组件ScrollView
ellis1970的博客
10-14 1563
实际项目中Scroll View上有几个显示内容节点大部分情况是取决于后端数据，因此需要通过代码动态创建
【Unity3D-UGUI系列】（十二）ScrollView 滚动视图组件详解
热门推荐
CSDN博客专家，Unity3D高级软件工程师，《Unity 3D从入门到实战》作者。
08-31 1万+
一、前言 首先，介绍一个UGUI，NGUI是UGUI的前身，Unity开发团队将NGUI的开发团队收到自己开发团队下，并且由此开发了UGUI。 UGUI系统是从Unity 4.6版本后才开始集成到Unity编辑器中。 UGUI的特点： 灵活 快速 可视化 对于开发者来说有很多的优点，比如说： 效率高 实现效果好 易于使用和拓展 与Unity编辑器的兼容性高 这是本系列文章的第十二篇： 【Unity3D-UGUI系列】（一）Canvas 画布组件详解 【Unity3D-UGUI系列】（二）Text文本
unity中Scroll View的使用
weixin_42171014的博客
12-10 2910
下面以垂直滑动为例： 首先Create-->UI-->Scroll View如下图所示：  点击scroll view，在组件信息中的Scroll Rect，垂直的列表，所以只需勾选Vertical，默认是都勾选状态，如果不懂各个代表的意思可以去官方文档查看 然后给Content添加组件Vertical Layout Group和Content Size Fitter并且设...
Unity——使用ScrollView实现滚动界面
weixin_43205816的博客
11-09 3598
在 Unity 中，实现滚动视图通常会用到 Scroll View 预制件（Prefab），这个预制件包含了必要的组件来创建一个可以滚动的内容区域。你可以通过脚本来进一步定制滚动的行为，例如响应滚动事件、改变滚动速度等。Unity 的 ScrollRect 组件提供了一些回调函数，如 OnValueChanged，可以用来监听滚动位置的变化。
UGUI学习--基础--【组合控件】ScrollBar 滚动条与ScrollView 滚动视图
最新发布
misco43的博客
07-16 1256
本文总结了Unity中ScrollBar和ScrollView控件的使用要点。ScrollBar是处理滚动条的交互控件，通常与ScrollView配合使用；ScrollView则控制滚动视图交互，常用于背包等界面。文章详细介绍了两个控件的参数设置（如Content、Viewport等核心参数）、代码控制方法（动态修改Content大小及位置）、事件监听方式，并重点讲解了动态添加元素的实现步骤：设置锚点、计算位置、动态生成子物体并调整Content尺寸。最后总结了使用注意事项，包括父子物体锚点关系等
UGUI-- Scrollview 滚动视图
Go_Accepted的博客
04-23 1200
1、ScrollvRect是什么 滚动视图组件，是UGUI中用于处理滚动视图相关交互的关键组件 默认创建的ScrllRect由4组对象组成： 父对象 ScrollRect组件依附的对象，还有一个Image组件，设为背景图 子对象 Viewport 控制滚动视图可视范围和内容显示 Scrollbar Horizontal 水平滚动条 Scrollbar Vertical 垂直滚动条 2、ScrollRect参数 Content：控制滚动视图显示内容.
UGUISuperScrollView
02-12
无限滚动列表 UGUI Super ScrollView gives easily-customizable ScrollView, based on UGUI ScrollRect. It is a set of C# scripts to help you create ScrollView that you need. It's very powerful and highly optimized for performance. UGUI超级ScrollView基于UGUI ScrollRect提供了易于定制的ScrollView。它是一组c#脚本，帮助您创建所需的ScrollView。它非常强大，并且对性能进行了高度优化。
Unity:UGUI之Scroll View剖析Demo,游戏等级UI设计,Layout,Toggle,Scroll
05-01
UGUI 之ScrollView剖析,及自定义设计,游戏等级的UI设计,可滑动切换;
Unity UGUI Scroll View 简介——背包系统常用组件
weixin_47260762的博客
01-11 4985
在制作背包系统UI界面时，Scroll View可以帮助我们轻松便捷地进行制作。下面我会用unity中的Scroll View做一个简单的UI界面，实现背包效果。 首先在Hierarchy窗口中右键->UI->Canvas创建一个画布，在画布下创建一个panel，再在panel下创建一个Scroll View。 这时屏幕中会出现这样的图案： 右侧和下方有两个拖动条，对于一般的背包来说，只需要右边的拖动条来控制上下移动就可以了，下方的可以直接删除，或者在Scroll View的Scroll R
实现多输入设备控制的UGUI Scroll View预制体
本文档提供了关于在Unity游戏引擎中使用Scroll View预制体的技术细节，该预制体支持手柄、键盘和鼠标控制，强调了其易用性和灵活性。 ### Unity中的Scroll View组件 Scroll View是Unity用户界面系统（UGUI）中的一...
UGUI-Scroll View实现图片翻页效果
Dream_Island
09-04 2016
using System.Collections; using System.Collections.Generic; using UnityEngine; using UnityEngine.UI; using UnityEngine.EventSystems; public class CenterOnTurnPage : MonoBehaviour,IPointerUpHandler...
Unity 实现UGUI的ScrollView无限滚动
sNameNo的博客
07-13 950
Unity实现UGUI 滑动条的无限滚动
UGUI学习笔记（十一）自制优化版滚动视图
夜槿笙歌的博客
09-12 543
为了让「Scroll View」组件实现内容框自适应大小，我们可以在「Content」上挂载「Vertical Layout Group」组件和「Content Size Fitter」组件。效果如下但这种实现方式有诸多问题。一方面，「Vertical Layout Group」这类排序组件可能会增加性能消耗；另一方面，「Content Size Fitter」必须靠子项才能撑开，当子项数量较多但又只需要展示少数几条时，会造成内存的浪费。因此我们需要自己实现一个优化版的滚动视图。
unity3D学习【功能实现】之四：滚动文字显示，类似公告面板
J辉的博客
08-15 9127
用处和目标：主要用作公告，文字比较多的可以弄个滚动条，鼠标上下拖动显示文字 步骤：1，canvas--UI---Image建立一个背景，随便弄个白色的图片拖到Image里。                 说明：这个Image是最重要的了，文字要在他之下显示，然后他自己本身要添加一些组件（比如scrollbar和mask）         2，Image--text,随便写很多的文字，对齐什么的都
Unity3d NGUI的使用（十一）（UITable制作下拉文字显示）
Unity3d 攻城师一枚
04-07 6706
使用UITable，UIDrag Scroll View，及UIScroll View制作下拉文字显示控件，主要用来的是 Tween动画效果，UIScroll View来实现收放
ugui scrollview使用
9527的专栏
07-12 3097
1 如图所示，在canvas中添加一个scrollview控件 2 观察此scrollview控件，它由以下几个控件组成 3 保留里面的vertical scrollbar，删除horizatonal方向的scrollbar 注： 1 Viewport为可视范围。 2 Content为内容实际范围，超出可视范围的cotnet将被隐藏 4 在Content中新建Panel,再在
Unity Scroll View简单介绍和使用
weixin_45072334的博客
05-13 7261
Unity Scroll View简单介绍
Unity中Scroll View的使用
m0_52155091的博客
03-27 1867
Scroll View介绍 当占用大量空间的内容需要在小区域中显示时，可使用滚动矩形。滚动矩形提供了滚动此内容的功能。 通常情况下，滚动矩形与遮罩 (Mask) 相结合来创建滚动视图，在产生的视图中只有滚动矩形内的可滚动内容为可见状态。此外，滚动矩形还可与一个或两个可拖动以便水平或垂直滚动的滚动条 (Scrollbar) 组合使用。 Scroll View子物体或组件 Content content即为该scroll view的内容物，所有的想放入scroll view的物体均创建在该物体下，常用格子组件（
UGUI之Scroll view
alayeshi的专栏
07-17 371
Scroll view是一个方便制作滑动的组件。游戏里背包等经常用到的。效果如下： 之前说过自己来制作滑动器的方法：https://blog.csdn.net/alayeshi/article/details/50240075 下面讲的是一个更为简单的方法：使用Scroll View组件。方法如下： 1.首先新建Scroll View，然后在它下面会找到Content。 2.将要被展示的内容放到它的下面，作为其子物体。如图： 3.在Content上添加组件Grid layout group
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值