以营销导向型建设网站方案,网页小游戏制作,专业简历怎么填,高端建站服务商1 前言 UI Toolkit简介 中介绍了 UI Builder、样式属性、UQuery#xff0c;本文将介绍 UI Toolkit 中的容器#xff0c;主要包含 VisualElement、ScrollView、ListView、UI Toolkit#xff0c;官方介绍详见→UXML elements reference。
2 VisualElement#xff08;空容器本文将介绍 UI Toolkit 中的容器主要包含 VisualElement、ScrollView、ListView、UI Toolkit官方介绍详见→UXML elements reference。
2 VisualElement空容器 VisualElement 是一个空容器便于组织和管理元素官方介绍见→UXML element VisualElement。 1属性介绍 View Data Key用于视图数据持久化如树展开状态、滚动位置、缩放级别)作为视图数据保存 / 加载的键如果不设置此键将禁用该容器的持久性。Picking Mode判断是否可以在 mouseEvents 期间选择此容器。Tooltip鼠标悬停到该容器上时弹出的提示文字。Usage Hints预期使用模式便于系统加速某些操作。Tab Index用于对焦点环中的焦点对象进行排序。Focusable容器是否能够获得焦点。 说明View Data Key、Picking Mode、Tooltip、Usage Hints、Tab Index、Focusable 都是基类属性后文若出现这些属性将不再赘述。 2获取根 VisualElement 容器
VisualElement rootVisualElement GetComponentUIDocument().rootVisualElement;
3 ScrollView滚动容器 1属性介绍 ScrollView 是一个滚动容器官方介绍见→UXML element ScrollView。 Mode控制用户滚动内容的方式取值有 Vertical垂直滚动、Horizontal水平滚动、Vertical And Horizontal垂直和水平滚动。Nested Interaction Kind滑动到边界后的行为取值有 default反弹、Stop Scrolling停止滑动、Forward Scrolling继续向前滑动。Horizontal Scroller Visibility水平滚动条的可见性取值有 Auto滑动时可见不滑动时消失、Always Visible一直可见、Hidden隐藏。Vertical Scroller Visibility垂直滚动条的可见性取值有 Auto滑动时可见不滑动时消失、Always Visible一直可见、Hidden隐藏。Horizontal Page Size控制水平滑动的速度。Vertical Page Size控制垂直滑动的速度。Touch Scroll Type触摸滑动类型Unrestricted不受约束的、Elastic弹性的、Clamped夹紧的。Scroll Deceleration Rate滑动停止时的减速度速度的导数为 0 时立刻停止滑动。Elasticity滑动到边界时的弹性值。 2添加元素 将元素拖拽到 ScrollView 上会自动放在其 unity-content-container 元素下面如下。 也可以通过以下代码添加元素。
VisualElement rootVisualElement GetComponentUIDocument().rootVisualElement;
ScrollView scrollview rootVisualElement.QScrollView();
scrollview.Add(new Label(LabelContent));
4 ListView列表 ListView 是一个列表容器官方介绍见→UXML element ListView。 1属性介绍 BindingPath目标属性绑定的路径。Fixed Item Height列表中 item 的高度以像素为单位。Virtualization Method设置 item 高度是固定的还是动态的取值有 Fixed Height固定高度、Dynamic Height动态高度。Show Border是否显示边框。Selection Type选择类型取值有 None禁止选中、Single只能选中单个 item、Multiple可以选中多个 item。Show Alternation Row Backgrounds显示交替行背景取值有 None不显示交替行背景、Content Only有内容时才显示交替行背景、All一直显示交替行背景。Show Foldout Header是否显示折叠页眉。Header Title页眉标题。Show Add Remove Footer是否显示添加 / 删除页脚如果显示在页脚会出现 和 - 按钮。Reorderable是否允许 item 重排序。Reorder Mode重排序模式取值有 Simple在重排序时显示标准的蓝线拖动器、Animated在每个 item 之前添加拖拽句柄可以用来拖拽单个 item。Show Bound Collection Size是否显示 item 数。Horizontal Scrolling是否可以水平滑动。 2ListView 的使用 ListViewDemo.cs
using UnityEngine;
using UnityEngine.UIElements;
using System.Collections.Generic;public class ListViewDemo : MonoBehaviour {private VisualElement root; // 根容器private ListView listView; // 列表private string[] itemsTitle new string[] {First, Second, Third, Fourth}; // item的标题private int[] itemsData new int[]{0, 1, 2, 3}; // item的数值private void Awake() {root GetComponentUIDocument().rootVisualElement;listView root.QListView();listView.fixedItemHeight 60;listView.itemsSource itemsData;listView.makeItem MakeItem;listView.bindItem BindItem;listView.onSelectionChange OnSelectionChange;}private VisualElement MakeItem() { // 创建item元素, 这里以Label元素呈现itemLabel label new Label();label.style.fontSize 50;label.style.unityTextAlign TextAnchor.MiddleLeft;return label;}private void BindItem(VisualElement visualElement, int index) { // 绑定itemLabel label visualElement as Label;label.text itemsTitle[index];}private void OnSelectionChange(IEnumerableobject objs) { // 选中事件回调foreach (object item in objs) {int data (int) item;Debug.Log(data);}}
} 运行后点击 Second显示如下。 打印日志如下。 5 GroupBox分组盒子 GroupBox 是一个逻辑分组容器官方介绍见→UXML element GroupBox。 1属性介绍 Text 分组标题。 2GroupBox 的使用 GroupBoxDemo.cs
using UnityEngine;
using UnityEngine.UIElements;public class GroupBoxDemo : MonoBehaviour {private VisualElement root; // 根容器private GroupBox groupBox; // 分组盒子private string[] choiceTitle new string[] {First, Second, Third, Fourth}; // item的标题private void Awake() {root GetComponentUIDocument().rootVisualElement;groupBox root.QGroupBox();groupBox.text GroupBoxDemo;groupBox.style.fontSize 50;root.Add(groupBox);for (int i 0; i choiceTitle.Length; i) {AddChoice(i);}}private void AddChoice(int index) { // 添加单选项RadioButton choice new RadioButton(choiceTitle[index]);choice.style.fontSize 50;choice.style.flexDirection FlexDirection.RowReverse;VisualElement ve choice.QueryVisualElement().AtIndex(2);ve.style.flexGrow 0;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显示如下。 打印日志如下。
