技术用户可以直接在 C# 脚本中定义__ UI__(即用户界面,User Interface)让用户能够与您的应用程序进行交互。Unity 目前支持三种 UI 系统。更多信息
See in Glossary 的布局。
您可以在 USS 文件中定义控件的外观,也可以在 C# 脚本中修改控件的样式属性。
控件是交互式的,它代表可以更改的值。例如,FloatField 代表一个浮点值。您可以创建 C# 脚本来更改控件的值、注册回调或应用数据绑定。
要在 UI 中使用控件,请将其添加到视觉树。
以下示例将 Button 控件添加到现有视觉树中。
var newButton = new Button("Click me!");
rootVisualElement.Add(newButton);
向 UI 层级结构添加控件时,布局引擎会自动处理大小和定位。您还可以覆盖视觉元素的大小和位置。
要访问或更改控件的值,请使用其 value 属性。
以下示例创建了一个 Toggle 控件和一个 Button 控件。当您点击按钮时,该开关的值会翻转。
// Create a toggle and register callback
m_MyToggle = new Toggle("Test Toggle") { name = "My Toggle" };
rootVisualElement.Add(m_MyToggle);
// Create button to flip the toggle's value
Button button01 = new Button() { text = "Toggle" };
button01.clicked += () =>
{
m_MyToggle.value = !m_MyToggle.value;
};
rootVisualElement.Add(button01);
要了解有关特定控件的属性的更多信息,请参阅 UI 工具包控件参考。
所有具有 value 属性的内置控件都会在值发生变化时发送一个事件。您可以注册一个回调来接收这个事件。
以下示例将创建一个 Toggle 控件并注册回调:
// Create a toggle and register callback
m_MyToggle = new Toggle("Test Toggle") { name = "My Toggle" };
m_MyToggle.RegisterValueChangedCallback((evt) => { Debug.Log("Change Event received"); });
rootVisualElement.Add(m_MyToggle);
要了解有关回调和事件的更多信息,请参阅事件处理。
可以直接将控件绑定到对象或序列化属性。例如,一个 FloatField 控件可绑定到属于某个 MonoBehaviour 的公共浮点变量。当控件绑定到该属性时,它会自动显示该属性的值。当您修改该控件时,属性值会更新。
同样,当属性值通过代码更改时,UI 会显示更新后的值。这种双向连接在创建自定义 Inspector 窗口时很有用。
有关数据绑定的更多信息,请参阅 SerializedObject 数据绑定。
并非所有控件都是可绑定的。要查看所有内置控件的列表以及它们是否支持绑定,请参阅 UI 工具包控件参考。
某些控件具有只读子元素。例如,ListView 控件有一个 ScrollView 子项。您可以使用 UQuery 访问子项的属性并覆盖其值。
以下示例通过覆盖 ScrollView 子项的 mouseWheelScrollSize 属性来更改 ListView 控件的滚动速度:
var scrollView = listView.Q<ScrollView>();
scrollView.mouseWheelScrollSize = 55;
控件具有可以在 C# 脚本中管理的不同状态。例如,可以启用或禁用控件。
以下示例创建了一个 Toggle 控件和一个 Button 控件。当您点击按钮时,该开关会被禁用。
// Create a toggle.
Toggle myToggle = new Toggle("A Toggle");
// Create a button to disable the toggle.
Button button01 = new Button();
button01.text = "Button01";
button01.RegisterCallback<ClickEvent>(evt =>
{
myToggle.SetEnabled(false);
});
还可以使用伪类在 USS 中实现状态更改时的视觉反馈更改。中实现状态更改时的视觉反馈更改。例如,要禁用开关,请使用具有 disabled 伪状态的选择器:
.unity-button:disabled
{
background-color: #000000;
}