浙江省建设厅 网站是多少,怎么制作网站程序,百度关键词优化公司哪家好,写软文是什么意思1 前言 UI Toolkit简介 中介绍了 UI Builder、样式属性、UQuery、Debugger#xff0c;UI Toolkit容器 中介绍了 VisualElement、ScrollView、ListView、GroupBox 等容器#xff0c;UI Toolkit样式选择器 中介绍了简单选择器、复杂选择器、伪类选择器等样式选择器#xff0c;…1 前言 UI Toolkit简介 中介绍了 UI Builder、样式属性、UQuery、DebuggerUI Toolkit容器 中介绍了 VisualElement、ScrollView、ListView、GroupBox 等容器UI Toolkit样式选择器 中介绍了简单选择器、复杂选择器、伪类选择器等样式选择器本文将介绍 UI Toolkit 中的元素主要包含 Label、Button、TextField、Toggle、Radio Button、Slider、Progress Bar、Dropdown、Foldout 等官方介绍详见→UXML elements reference。
2 Label标签 Label 官方介绍见→UXML element Label。 1属性介绍 View Data Key用于视图数据持久化如树展开状态、滚动位置、缩放级别)作为视图数据保存 / 加载的键如果不设置此键将禁用该元素的持久性。Picking Mode判断是否可以在 mouseEvents 期间选择此容器。Tooltip鼠标悬停到该容器上时弹出的提示文字。Usage Hints预期使用模式便于系统加速某些操作。Tab Index用于对焦点环中的焦点对象进行排序。Focusable容器是否能获得焦点。 BindingPath目标属性绑定的路径。Text标签的文本内容。Enable Rich Text是否支持富文本。Display Tooltip When Elided悬停提示是否显示省略文本的完整版本。 说明View Data Key、Picking Mode、Tooltip、Usage Hints、Tab Index、Focusable、BindingPath 都是基类属性后文若出现这些属性将不再赘述。 2富文本应用 当支持富文本时在 text 中输入以下富文本显示如下。
bHello/b colorgreenWorld/color 3 Button按钮 Button 官方介绍见→UXML element Button。 1属性介绍 Text按钮的文本内容。Enable Rich Text是否支持富文本。Display Tooltip When Elided悬停提示是否显示省略文本的完整版本。 2事件响应 ButtonDemo.cs
using UnityEngine;
using UnityEngine.UIElements;public class ButtonDemo : MonoBehaviour {private void Awake() {VisualElement root GetComponentUIDocument().rootVisualElement;Button button root.QButton();button.clicked OnClick;}private void OnClick() {Debug.Log(Clicked);}
}
4 TextField输入文本 TextField 官方介绍见→UXML element TextField。 1属性介绍 Label标签。Value输入文本修改此值不会触发事件。Max Length输入文本最大长度-1 表示长度不受限。Password是否为密码如果是密码将使用 Mask Character 中的字符显示默认使用 * 显示。Mask Character当输入的文本是密码时替换显示的字符。Text输入文本修改此值会触发事件并且会将文本同步到 value 中。Readonly输入文本是否是只读的。Is Delayed是否延时更新 value如果延时更新则在用户按 Enter 或输入文本失焦后才更新 value 属性。Multiline是否允许多行输入。 2事件响应 TextFieldDemo.cs
using UnityEngine;
using UnityEngine.UIElements;public class TextFieldDemo : MonoBehaviour {private void Awake() {VisualElement root GetComponentUIDocument().rootVisualElement;TextField textField root.QTextField();textField.isDelayed true; // 延时更新value, 在用户按Enter或输入文本失焦后才更新value属性textField.RegisterValueChangedCallback(OnValueChanged);}private void OnValueChanged(ChangeEventstring e) { // 输入回调事件Debug.Log(previousValue e.previousValue , newValue e.newValue);}
}
5 Toggle复选框 Toggle 官方介绍见→UXML element Toggle。 1属性介绍 Label复选框标签。Value复选框的选中状态。Text复选框后面的文本。 2事件响应 ToggleDemo.cs
using UnityEngine;
using UnityEngine.UIElements;public class ToggleDemo : MonoBehaviour {private VisualElement root; // 根容器private GroupBox groupBox; // 分组盒子private string[] toggleLabel new string[] {First, Second, Third, Fourth}; // toggle的标签private void Awake() {root GetComponentUIDocument().rootVisualElement;groupBox root.QGroupBox();groupBox.text ToggleDemo;groupBox.style.fontSize 50;root.Add(groupBox);for (int i 0; i toggleLabel.Length; i) {AddToggle(i);}}private void AddToggle(int index) { // 添加单选项Toggle toggle new Toggle();toggle.text toggleLabel[index];toggle.style.fontSize 50;VisualElement ve toggle.QueryVisualElement().AtIndex(2);ve.style.marginRight 10;toggle.RegisterValueChangedCallback(e OnValueChanged(index, e));groupBox.Add(toggle);}private void OnValueChanged(int index, ChangeEventbool e) { // value变化回调函数Debug.Log(index index , previousValue e.previousValue , newValue e.newValue);}
} 运行后点击 Second、Third显示如下。 打印日志如下。 6 RadioButton单选框 RadioButton 官方介绍见→UXML element RadioButton。 1属性介绍 Label单选框标签。Value单选框的选中状态。Text单选框后面的文本。 2事件响应 RadioButtonDemo.cs
using UnityEngine;
using UnityEngine.UIElements;public class RadioButtonDemo : MonoBehaviour {private VisualElement root; // 根容器private GroupBox groupBox; // 分组盒子private string[] choiceLabel new string[] {First, Second, Third, Fourth}; // choice的标签private void Awake() {root GetComponentUIDocument().rootVisualElement;groupBox root.QGroupBox();groupBox.text RadioButtonDemo;groupBox.style.fontSize 50;root.Add(groupBox);for (int i 0; i choiceLabel.Length; i) {AddChoice(i);}}private void AddChoice(int index) { // 添加单选项RadioButton choice new RadioButton();choice.text choiceLabel[index];choice.style.fontSize 50;VisualElement ve choice.QueryVisualElement().AtIndex(2);ve.style.marginRight 10;choice.RegisterValueChangedCallback(e OnValueChanged(index, e));groupBox.Add(choice);}private void OnValueChanged(int index, ChangeEventbool e) { // 选项变化回调函数Debug.Log(index index , previousValue e.previousValue , newValue e.newValue);}
} 运行后点击 Second显示如下。 打印日志如下。 7 RadioButtonGroup单选按钮组 RadioButtonGroup 官方介绍见→UXML element RadioButtonGroup。 1属性介绍 Label单选按钮组标签。Value当前选中的单选按钮索引。Choices单选按钮后面的文本通过 , 隔开的字符串数组。 2配置单选按钮组 配置 RadioButtonGroup 如下。 展开 RadioButtonGroup发现其下自动添加了 4 个 RadioButton如下。 显示如下。 3事件响应 RadioButtonGroupDemo.cs
using UnityEngine;
using UnityEngine.UIElements;public class RadioButtonGroupDemo : MonoBehaviour {private VisualElement root; // 根容器private string[] choices new string[] {First, Second, Third, Fourth}; // choices的标签private void Awake() {root GetComponentUIDocument().rootVisualElement;RadioButtonGroup group root.QRadioButtonGroup();group.label ;group.choices choices;group.style.fontSize 50;group.RegisterValueChangedCallback(OnValueChanged);}private void OnValueChanged(ChangeEventint e) { // value变化回调函数Debug.Log(previousValue e.previousValue , newValue e.newValue);}
} 运行后点击 Second显示如下。 打印日志如下。 8 Slider 和 SliderInt滑动条 Slider 官方介绍见→UXML element SliderSliderInt 官方介绍见→UXML element SliderInt。 1属性介绍 Label滑动条标签。Value滑动条的数值。Low Value滑动条的最小值。High Value滑动条的最大值。Page Size单击滑动条时Value 的变化量Page Size取 0 时单击滑动条value 取鼠标位置的滑动数值。Show Input Field显示滑动条的数值。Direction滑动条的方向取值有 Horizontal水平的、Vertical垂直的。Inverted随 value 值的增大滑动条反向增长。 2事件响应 SliderDemo.cs
using UnityEngine;
using UnityEngine.UIElements;public class SliderDemo : MonoBehaviour {private VisualElement root; // 根容器private void Awake() {root GetComponentUIDocument().rootVisualElement;Slider slider root.QSlider();slider.style.width 500;slider.RegisterValueChangedCallback(OnValueChanged);}private void OnValueChanged(ChangeEventfloat e) { // value变化回调函数Debug.Log(previousValue e.previousValue , newValue e.newValue);}
} 运行后滑动滑块打印日志如下。 9 ProgressBar进度条 ProgressBar 官方介绍见→UXML element ProgressBar。 1属性介绍 Low Value进度条的最小值。High Value进度条的最大值。Title进度条中间的标题。 2事件响应 ProgressBarDemo.cs using System.Collections;
using UnityEngine;
using UnityEngine.UIElements;public class ProgressBarDemo : MonoBehaviour {private VisualElement root; // 根容器private ProgressBar progressBar; // 进度条private void Awake() {root GetComponentUIDocument().rootVisualElement;progressBar root.QProgressBar();progressBar.style.width 500;progressBar.value progressBar.lowValue;progressBar.QueryVisualElement().AtIndex(2).style.backgroundColor Color.grey; // 进度条背景色progressBar.QueryVisualElement().AtIndex(3).style.backgroundColor Color.green; // 进度条颜色progressBar.RegisterValueChangedCallback(OnValueChanged);StartCoroutine(Progress());}private IEnumerator Progress() { // 更新进度条while (progressBar.value progressBar.highValue) {progressBar.value 0.2f;yield return null;}}private void OnValueChanged(ChangeEventfloat e) { // value变化回调函数Debug.Log(previousValue e.previousValue , newValue e.newValue);}
} 说明这里通过协程更新进度条协程的介绍详见→协同程序在 OnValueChanged 中打印进度条的进度。 运行效果如下。 10 Dropdown下拉列表 Dropdown 官方介绍见→UXML element DropdownField。 1属性介绍 Label下拉列表标签。Index选中的选项的索引。Choices选项的文本通过 , 隔开的字符串数组。 2配置下拉列表 配置 Dropdown 如下。 显示如下。 3事件响应 DropdownDemo.cs
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UIElements;public class DropdownDemo : MonoBehaviour {private VisualElement root; // 根容器private Liststring choices new Liststring {First, Second, Third, Fourth}; // choices的标签private void Awake() {root GetComponentUIDocument().rootVisualElement;DropdownField dropdown root.QDropdownField();dropdown.style.width 600;dropdown.choices choices;dropdown.RegisterValueChangedCallback(OnValueChanged);}private void OnValueChanged(ChangeEventstring e) { // value变化回调函数Debug.Log(previousValue e.previousValue , newValue e.newValue);}
} 运行后点击 Second显示如下。 打印日志如下。 11 Foldout折叠列表 Foldout 官方介绍见→UXML element Foldout。 1属性介绍 Text折叠列表文本。Value折叠列表的展开状态true 表示展开false 表示收缩。 2添加元素 将元素拖拽到 Foldout 上会自动放在其 unity-content 元素下面如下。 显示如下。 3事件响应
using UnityEngine;
using UnityEngine.UIElements;public class FoldoutDemo : MonoBehaviour {private VisualElement root; // 根容器private Foldout foldout; // 折叠列表private string[] items new string[] {First, Second, Third, Fourth}; // items的标签private void Awake() {root GetComponentUIDocument().rootVisualElement;foldout root.QFoldout();for(int i 0; i items.Length; i) {AddItems(items[i]);}foldout.RegisterValueChangedCallback(OnValueChanged);}private void AddItems(string text) {Label label new Label(text);foldout.Add(label);}private void OnValueChanged(ChangeEventbool e) { // value变化回调函数Debug.Log(previousValue e.previousValue , newValue e.newValue);}
} 运行后点击折叠三角形打印日志如下。
