【Unity UGUI 交互组件——Scrollbar（8）】
Unity UGUI 滚动条 (Scrollbar) 速览
Scrollbar ≠ Slider：Slider 用来 选数值，Scrollbar 用来 滚动视图。
1. 概述
Scrollbar 是 “滚动视图专用滑动器”，常见于
- 聊天框右侧 垂直滚动
- 地图查看器 水平滚动
- 时间轴 水平滚动
2.三个组成
| Hierarchy 对象 | 作用一句话 | 可删？ | 常用修改 |
|---|---|---|---|
| Scrollbar (根) | 挂 Scrollbar 脚本，统筹一切 | ❌ | 改方向、范围、事件 |
| Sliding Area | 轨道 容器，决定把手行程 | ❌ | 改锚点/大小控制行程 |
| Handle | 可拖动把手 (Image/Button) | ❌ | 换图标、加阴影、调尺寸 |
没有单独的 Background / Fill，背景直接由 Sliding Area 的 Image 充当，把手大小由
Handle Rect+Size控制。
3. 滚动条 vs 滑动条
| 维度 | Scrollbar | Slider |
|---|---|---|
| 目的 | 滚动视图 | 选数值 |
| Handle | 大小可变 表示可滚动范围 | 固定大小 |
| 典型值 | Value 0-1 表示 滚动位置 | Value 0-100 表示 数值 |
| 用例 | 文本、地图、时间轴 | 音量、血量、难度 |
4. SCrollbar参数
| 属性 | 中文 | 说明 & 常用值 |
|---|---|---|
| Fill Rect | 背景图 | 装饰轨道底色 |
| Handle Rect | 控制柄 | 拖控制柄 Image |
| Direction | 方向 | LeftToRight / RightToLeft / TopToBottom / BottomToTop |
| Value | 当前位置 | 0-1 的百分比，0 代表起点，1 代表终点 |
| Size | 控制柄比例 | 0-1，表示 可见区域 / 总长度（滚动条特有） |
| Number Of Steps | 步数 | 0 = 连续；>0 = 离散滚动格数 |
| OnValueChanged(float) | 事件 | 拖动时回调，参数为当前 Value |
| Interactable | 可交互开关 | false 时禁止拖动，但脚本仍可改值 |
| Transition / Navigation | 同 Slider | 见 Slider 章节 |
5. 常见用法
| 场景 | 做法简述 |
|---|---|
| 垂直文字滚动 | Direction = TopToBottom，Size = 0.2，绑定 ScrollRect |
| 水平地图滚动 | Direction = LeftToRight，Size = 0.3，绑定 ScrollRect |
| 时间轴滚动 | NumberOfSteps = 100，让时间轴一格一格跳 |
6. 脚本控制示例
using UnityEngine;
using UnityEngine.UI;public class ScrollbarDemo : MonoBehaviour
{public Scrollbar scrollbar; // 拖进来void Start(){// 初始位置 50%scrollbar.value = 0.5f;// 监听滚动事件scrollbar.onValueChanged.AddListener(OnScroll);}void OnScroll(float v){Debug.Log("当前滚动位置：" + v);}
}
7. 一句话总结
Scrollbar 就是 “可拖动的滚动把手”，用它 + ScrollRect 即可实现 文字、地图、时间轴 的平滑滚动；记住 Size 决定把手长度，Value 决定滚动位置即可。