滚动视图

ScrollView 在可滚动区域内显示其内容。将内容添加到 ScrollView 时，内容将添加到内容容器 （#unity-content-container） 的 ScrollView。

创建 ScrollView

你可以使用 UI Builder、UXML 或 C# 创建 ScrollView。以下 C# 示例创建具有水平和垂直滚动功能的 ScrollView，其中包含标题 Label 和许多 Toggle 元素。它还添加了一个按钮，单击该按钮时，使用垂直滚动器将列表向下滚动一页。

// Create a ScrollView with vertical and horizontal scrolling enabled
// and set its width and height.
var scrollView = new ScrollView(ScrollViewMode.VerticalAndHorizontal);
scrollView.style.width = 250;
scrollView.style.height = 400;

// Add a label and 100 toggle elements to the ScrollView.
scrollView.Add(new Label("List of checkboxes:"));

for (int i = 0; i < 100; ++i)
{
    var toggle = new UnityEngine.UIElements.Toggle()
    { text = "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua." };
    scrollView.Add(toggle);
}

// Access the vertical scroller.
var verticalScroller = scrollView.verticalScroller;

// Add a button to scroll down one page when clicked.
var scrollDownButton = new Button(() =>
{
    verticalScroller.ScrollPageDown(50f);
})
{ text = "Scroll Down One Page" };

uiDocument.rootVisualElement.Add(scrollView);
uiDocument.rootVisualElement.Add(scrollDownButton);

管理滚动条

您可以指定滚动条移动的滚动模式，水平滚动条是可见的还是垂直滚动条，并控制滚动条的速度。

滚动条模式和可见性

要在 UI Builder 中设置滚动条移动的滚动模式，请在检查器一个 Unity 窗口，显示有关当前选定游戏对象、资产或项目设置的信息，允许您检查和编辑值。更多信息
请参阅术语表窗口中，为 Mode 选择以下选项之一：

• 垂直（默认）
• 水平
• 垂直和水平

若要在 UI Builder 中设置滚动条的可见性，请在 ScrollView 的“检查器”窗口中，为“水平滚动器可见性”或“垂直滚动器可见性”选择以下选项之一：

• 自动（默认）
• 始终可见
• 隐藏

控制滚动速度

若要控制滚动速度，请在UI Builder、UXML或C#代码中调整以下属性的值。值越高，滚动速度越快。

• horizontal-page-size控制使用键盘或屏幕滚动条按钮（箭头和手柄）时水平滚动的速度。速度是通过将页面大小乘以指定值来计算的。例如，值2表示每次滚动移动覆盖的距离等于页面宽度的两倍。
• vertical-page-size控制使用键盘或屏幕滚动条按钮（箭头和手柄）时的垂直滚动速度。速度是通过将页面大小乘以指定值来计算的。例如，值2表示每次滚动移动覆盖的距离等于页面长度的两倍。
• mouse-wheel-scroll-size控制使用鼠标滚轮时的滚动速度。速度的计算方法是将指定值除以18，对应于默认的行高18px.例如，如果将值设置为36，每次滚动移动覆盖的距离相当于两行内容。

注意：您还可以覆盖 USS 内置变量 –unity-metrics-single_line-height控制使用鼠标滚轮时的滚动速度。这mouse-wheel-scroll-size属性优先于–unity-metrics-single_line-heightUSS 变量。

滚动到最后

若要滚动到 ScrollView 的末尾，请将 scrollOffset 属性设置为垂直滚动器的最大值。这会在初始化 UI 时将内容滚动到末尾。

// Set the scroll offset to the bottom of the ScrollView.
// This scrolls to the bottom when the UI is initialized.
scrollView.scrollOffset = new Vector2(0, scrollView.verticalScroller.highValue);

将元素包装在 ScrollView 中

你可以包装视觉元素实例化或派生自 C# 的可视化树的节点VisualElement类。您可以设置外观样式、定义行为并将其作为 UI 的一部分显示在屏幕上。更多信息
请参阅术语表在 ScrollView 中，以便元素成行显示。如果行已满，则元素将继续显示在下一行上。

若要将视觉元素包装在 ScrollView 中，请将 ScrollView 的内容容器flex-direction自row和flex-wrap自wrap.

在 USS 中：

.unity-scroll-view__content-container {
    flex-direction: row;
    flex-wrap: wrap;
}

在 C# 中：

scrollview.contentContainer.style.flexDirection = FlexDirection.Row;
scrollview.contentContainer.style.flexWrap = Wrap.Wrap;

在 ScrollView 中换行元素的文本

若要将元素的文本换行到 ScrollView 中，例如 Label 元素的文本，请执行以下作：

1. 使用以下任一方法设置 Label 元素的样式：
   • 在 UI Builder 的 Label 的 Inspector 窗口中，选择 Text > Wrap > normal。
   • 应用样式white-space: normal;添加到 USS、UXML 或 C# 中的 Label 元素。
2. 在 ScrollView 中创建 VisualElement 作为容器。ScrollView 中的原始容器元素未设置边界（大小无限），因此文本无法正确换行。此容器 VisualElement 为要换行的文本提供了有限大小。
3. 将标签添加到 VisualElement 容器。

例子

• 在 ScrollView 中包装内容：此示例演示如何使用样式在滚动视图中包装内容。

C# 类和命名空间

C# 类：ScrollView
命名空间：UnityEngine.UIElements
基类：VisualElement

成员 UXML 属性

此元素具有以下成员属性：

继承的UXML属性

此元素从其基类继承以下属性：

此元素还继承了以下属性VisualElement:

USS 级

下表列出了所有 C# 公共属性名称及其相关的 USS 选择器。

您还可以使用 Inspector 或 UI Toolkit Debugger 中的 Matching Selectors 部分来查看哪些 USS 选择器会影响VisualElement在其层次结构的各个层面。

其他资源

• 列表视图
• 滚动器