版本: 6000+
ListView 控件是创建列表最有效的方式。此示例演示如何使用运行时绑定将 ListView 绑定到列表。运行时绑定支持运行时和编辑器 UI(用户界面) 允许用户与您的应用程序交互。Unity 目前支持三个 UI 系统。 更多信息
查看 术语表。为了演示目的，此示例在编辑器窗口中显示 ListView。
此示例创建一个 ListView 和一个列表。要将 ListView 绑定到列表，请将 ListView 的绑定数据源设置为包含列表的属性。
您可以在此 GitHub 存储库 中找到此示例创建的完整文件。
本指南适用于熟悉 Unity 编辑器、UI 工具包和 C# 脚本的开发人员。在开始之前，请熟悉以下内容
创建一个包含 Item 对象列表的示例 List 对象。每个 Item 包含一个 name 和一个 enabled 属性。
runtime-binding-listview 的文件夹，用于存储所有文件。runtime-binding-listview 文件夹中，创建一个名为 Scripts 的文件夹，用于存储所有 C# 脚本一段代码，允许您创建自己的组件，触发游戏事件，随时间推移修改组件属性，并以任何您喜欢的方式响应用户输入。 更多信息Scripts 文件夹中，创建一个名为 ExampleItemObject.cs 的 C# 脚本，内容如下 using System;
using System.Collections.Generic;
using UnityEngine;
public class ExampleItemObject
{
public List<Item> items = new();
public void Reset()
{
items = new List<Item>{
new() { name = "Use Local Serverdfsdfsd", enabled = false },
new() { name = "Show Debug Menu", enabled = false },
new() { name = "Show FPS Counter", enabled = true },
};
}
// Use a struct instead of a class to ensure that the ListView can create items
// when the + button is clicked.
public struct Item
{
public bool enabled;
public string name;
}
}
在 UI 生成器中创建列表项目的模板。每个项目包含一个 Toggle 和一个 TextField。将它们绑定到 Item 对象的 enabled 和 name 属性。
在 runtime-binding-listview 文件夹中，创建一个名为 UXML 的文件夹。
在 UXML 文件夹中，创建一个名为 ListViewItem.uxml 的 UXML 文件。
双击 ListViewItem.uxml 文件，在 UI 生成器中打开它。
在 层次结构 面板中，添加一个 VisualElement。
将一个 Toggle 作为 VisualElement 的子元素添加。
将一个 TextField 作为 VisualElement 的子元素添加。
删除 Toggle 和 TextField 的标签文本。
将 VisualElement 的 Flex 方向 设置为 Row。
在 检查器一个 Unity 窗口，显示有关当前选定游戏对象、资源或项目设置的信息，允许您检查和编辑值。 更多信息
查看 术语表 面板的 Toggle 中，执行以下操作
右键单击 值，然后选择 添加绑定。
在 添加绑定 窗口中，将 数据源路径 设置为 enabled。
在 检查器 面板的 TextField 中，执行以下操作
name。保存 UXML 文件。完成后的 UXML 文件如下所示
<ui:UXML xmlns:ui="UnityEngine.UIElements" xmlns:uie="UnityEditor.UIElements" xsi="http://www.w3.org/2001/XMLSchema-instance" engine="UnityEngine.UIElements" editor="UnityEditor.UIElements" noNamespaceSchemaLocation="../../UIElementsSchema/UIElements.xsd" editor-extension-mode="False">
<ui:VisualElement name="VisualElement" style="flex-direction: row;">
<ui:Toggle>
<Bindings>
<ui:DataBinding property="value" data-source-path="enabled" />
</Bindings>
</ui:Toggle>
<ui:TextField placeholder-text="filler text">
<Bindings>
<ui:DataBinding property="value" data-source-path="name" />
</Bindings>
</ui:TextField>
</ui:VisualElement>
</ui:UXML>
在 UI 生成器中创建 ListView UI，并将项目模板设置为 ListViewItem.uxml。
在 UXML 文件夹中，创建一个名为 UIListView.uxml 的 UXML 文件。
双击 UIListView.uxml 文件，在 UI 生成器中打开它。
在 层次结构 面板中，添加一个 ListView。
在 检查器 面板的 ListView 中，执行以下操作
将 虚拟化方法 设置为 动态高度。
将 重新排序模式 设置为 动画。
将 项目模板 设置为 ListViewItem.uxml。
将 绑定源选择模式 设置为 自动分配。
选中 可重新排序 复选框。
选中 显示添加删除页脚 复选框。
将 标题 设置为 Items。
选中 显示展开标题 复选框。
保存 UXML 文件。完成后的 UXML 文件如下所示
<ui:UXML xmlns:ui="UnityEngine.UIElements" xmlns:uie="UnityEditor.UIElements" xmlns="UnityEngine.UIElements" ue="UnityEditor.UIElements" editor-extension-mode="False">
<ui:ListView virtualization-method="DynamicHeight" reorder-mode="Animated" binding-source-selection-mode="AutoAssign" show-add-remove-footer="true" header-title="Items" reorderable="true" show-border="false" show-foldout-header="true" item-template="ListViewItem.uxml" show-bound-collection-size="false" />
</ui:UXML>
创建一个包含 ListView 的自定义编辑器窗口，并将其绑定到 List 的 items 属性。此示例在 C# 脚本中设置绑定源。您也可以在 ListView 元素内的 UXML 文件中手动设置绑定源，例如
<ui:ListView>
<Bindings>
<ui:DataBinding property="itemsSource" data-source-path="items" />
</Bindings>
</ui:ListView>
Scripts 文件夹中，创建一个名为 Editor 的文件夹。Editor 文件夹中，创建一个名为 ListViewTestWindow.cs 的 C# 脚本，内容如下 using UnityEngine;
using UnityEngine.UIElements;
using UnityEditor;
using UnityEditor.UIElements;
using System.Collections.Generic;
using Unity.Properties;
internal class ListViewTestWindow : EditorWindow
{
[SerializeField] private VisualTreeAsset itemLayout;
[SerializeField] private VisualTreeAsset editorLayout;
ExampleItemObject m_ExampleItemObject;
[MenuItem("Window/ListViewTestWindow")]
static void Init()
{
ListViewTestWindow window = EditorWindow.GetWindow<ListViewTestWindow>();
window.Show();
}
void CreateGUI()
{
m_ExampleItemObject = new();
editorLayout.CloneTree(rootVisualElement);
var listView = rootVisualElement.Q<ListView>();
// This example sets the itemTemplate and bindingSourceSelectionMode in the UXML file.
// You can also set them in the C# script like the following:
//listView.itemTemplate = itemLayout;
//listView.bindingSourceSelectionMode = BindingSourceSelectionMode.AutoAssign;
// Set the binding source to the ExampleItemObject instance.
listView.dataSource = m_ExampleItemObject;
// Set the itemsSource binding to the items property of the List object.
listView.SetBinding("itemsSource", new DataBinding() {dataSourcePath = new PropertyPath("items")});
m_ExampleItemObject.Reset();
}
}
编辑器窗口显示一个绑定到 ExampleItemObject.cs 中定义的项目的 ListView。如果您更新 ExampleItemObject.cs 中 Item 的 enabled 或 name 属性的值，更改将自动反映在 ListView 中。