Unity2019 UIElement 笔记（六）USS介绍上

2024-01-18 10:10
文章标签 介绍 笔记 unity2019 uielement uss

本文主要是介绍Unity2019 UIElement 笔记（六）USS介绍上，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

同样，本文来自Unity官方文档，https://docs.unity3d.com/Manual/UIE-USS.html ，具体内容可自行查看。

USS选择器

我们通过下面这张图片演示层次结构
在这里插入图片描述

简单选择器（Simple selectors）

最简单的选择器可以是通配符（wildcard），也可以是类型（type），名称（name）或者类名（class）

类型（Type）

Button/*TypeName*/ {...}
  • 使用Type selector根据其C＃类型来匹配元素
  • 使用Type selector时，仅指定具体的对象类型，不要在类型名称中包含命名空间。
  • 在上述例子中，Button匹配两个按钮

名称（Name）

#name/*name*/ {...}
  • 使用Name selector是根据VisualElement.name属性的值来匹配元素
  • 在上述例子中#Cancel会匹配第二个按钮
  • 元素名称在面板内应该是唯一的（并不是强制性的），但是使用不唯一的名称可能会导致意外匹配
  • 在分配Name selector时不要包括#

类（Class）

.class/*class*/ {...}
  • 使用Class selector匹配分给特定类的元素
  • 要匹配元素，只需要该元素指定了该类即可
  • 在上述例子中.yellow分配给了名为container2的元素和名为OK的按钮元素
  • 如果要在Class selector中指定多个类，则对于要匹配的元素，为其分配相同的类名
  • 在分配Class selector时不要包括.
  • 类名不能以数字开头

通配符（Wildcard）

* {...}
  • 匹配任何元素

伪状态（Pseudo-states）

:pseudo-state { ... }
  • 当元素进入特定状态时，使用伪状态来匹配元素。例如，Button:hover，当用户将光标定位在可视元素上时，就会匹配该元素。
  • 支持的伪状态：
    1.hover ：光标悬停在可视元素上。
    2.active ：视觉元素正在与之交互。
    3.inactive ：视觉元素不再与之交互。
    4.focus ：聚焦于视觉元素。
    5.selected ：不使用。
    6.disabled：可视元素设置为enabled ==false
    7.enabled：可视元素设置为enabled ==true。
    8.checked：如果该元素是一个Toggle元素，就进行检查。
    9.root ：树中最高级别的可视元素。
  • 在简单选择器之后指定伪状态
  • 伪状态不能扩展
  • 只有一组预定义的支持伪状态。

复杂选择器（Complex selectors）

复杂选择器就是简单选择器和分隔符的组合，还包括选择器列表，这些列表提供了将相同样式应用于大量元素的缩写方式

分隔符

UIElements支持以下分隔符：

  • 空格分隔符匹配元素的所有子类
    这里要注意：
    如果节点匹配了，那其子节点全部会匹配
    如果节点不匹配，那么只有匹配的子节点才会匹配
  • “大于”符号（>）匹配是由先前选择器匹配元素的直接子类
    而这个只会匹配直接子类的节点
    如果节点匹配了，那其子节点全部会匹配
    如果节点不匹配，那么就全部不匹配
    在上述例子中：

#container1 .yellow ：匹配内部元素和第一个Button
#container2 > .yellow ：仅匹配内部元素

简单案例
uss ------- container1 .yellow

在这里我调整了一下PopupWindow的大小

#container1 .yellow
{ font-style:bold;
}
.a
{height:250px;
}
.b
{height:650px;
}
uxml ------- container1 .yellow
  <PopupWindow name="container1" class="b" type="" text ="container1"><PopupWindow name="container2" class="yellow" text ="container2"><Button name="OK" text="OK" class="yellow"/><!--Button name="Cancel" text="Cancel" class=""/--><PopupWindow name="container3" class="a" text ="container3"><!--Button name="ccc" text="ccc" class="yellow"/--><Button name="ddd" text="ddd" class=""/></PopupWindow></PopupWindow><PopupWindow name="container4" class="a" text ="container4"><Button name="eee" text="eee" class="yellow"/></PopupWindow></PopupWindow>
结果 ------- container1 .yellow

在这里插入图片描述
就是之前所说的：
如果节点匹配了，那其子节点全部会匹配
如果节点不匹配，那么只有匹配的子节点才会匹配

uss ------- container1 > .yellow
#container1 > .yellow
{ font-style:bold;
}
.a
{height:250px;
}
.b
{height:650px;
}
uxml ------- container1 > .yellow
  <PopupWindow name="container1" class="b" type="" text ="container1"><PopupWindow name="container2" class="yellow" text ="container2"><Button name="OK" text="OK" class="yellow"/><PopupWindow name="container3" class="a" text ="container3"><Button name="ccc" text="ccc" class="yellow"/><Button name="ddd" text="ddd" class=""/></PopupWindow></PopupWindow><PopupWindow name="container4" class="a" text ="container4"><Button name="eee" text="eee" class="yellow"/><PopupWindow name="container5" class="yellow" text ="container5"><Button name="ccc" text="ccc" class="yellow"/><Button name="ddd" text="ddd" class=""/></PopupWindow></PopupWindow></PopupWindow>
结果 ------- container1 > .yellow

在这里插入图片描述
就是之前所说的：
而这个只会匹配直接子类的节点
如果节点匹配了，那其子节点全部会匹配
如果节点不匹配，那么就全部不匹配

选择器列表（Selector List）

  • 使用选择器列表将相同的样式定义应用于许多元素。（就是批量定义）
  • 每个选择器用逗号分隔，每个选择器可以是简单或复杂的选择器
#container1, Button { padding-top:10 }

和

#container1 { padding-top: 10 } Button { padding-top: 10}

是一样的

选择器的优先级

  1. 在C#中设置的值具有最高的优先级
  2. 通配符（Wildcard） < 类型（TypeName） < 类（Class） < 名称（Name）
    因为他们一级比一级更加具体
  3. 如果两个选择器相同，则文件中最后出现的选择器优先
  4. 如果是跨文件的优先级，则具有较高深度和兄弟索引的元素优先
  5. 当默认样式和用户定义的样式具有相同的选择器时，用户定义的选择器优先

USS属性类型

内置属性vs自定义属性

  1. 使用USS时，在代码中可以为自定义属性和内置的VisualElement 属性指定值代码。
  2. 除了在USS中读取值意外，也可是在C#中分配属性值，C#中分配的属性优先度最高。
  3. 可以使用Custom Properties API扩展USS，自定义属性需要的–前缀。

属性值（Property values）

本节列出了支持的类型

长度（Length）

  1. UIElements仅支持像素（px）测量单位
  2. 如果未指定度量单位，则UIElements假定属性类型以像素表示
  3. 但是，在将来的版本中，可能会支持其他单位，为避免将来出现兼容性问题，建议指定px为度量单位
  4. 注意！0是一个特殊值，不需要使用单位

数字（Numeric）

数值表示为浮点或整数文字

关键字（Keywords）

  1. 某些内置属性支持特定关键字
  2. 关键字提供描述性名称而不是数字
  3. 所有属性都支持initial这个全局关键字，降属性重置为其默认属性
    支持的属性会在下一章介绍

颜色（Color）

支持以下三种：

  1. 十六进制值：#FFFF00（rgba每个通道一个字节），#0F0（rgb）
  2. RGB功能： rgb(255, 255, 0)
  3. RGBA功能： rgba(255, 255, 0, 1.0)

Assets

可以通过resource()或url()来导入assets，例如，background-image: resource(“Images/img.png”)指定背景图像。

使用resource导入

resource()函数接受位于Resources文件夹或Editor Default Resources文件夹下的文件，并带有以下条件：

  • 如果文件位于Resources文件夹下，请不要包含文件扩展名。例如：background-image: resource(“Images/my-image”)
  • 如果文件位于Editor Default Resources，则必须包含文件扩展名。例如：background-image: resource(“Images/default-image.png”)
使用url导入

url()函数要求文件路径相对于项目根目录或包含USS文件的文件夹，必须包含文件扩展名。在以下例子中，假设USS文件位于Assets\Editor\USS而thumb.png背景图像位于Assets\Editor\Resources：

  • 根据USS文件的位置，则相对路径： url("…/Resources/thumb.png");
  • 根据项目的位置，使用以下示例之一作为绝对路径：
  1. url("/Assets/Editor/Resources/thumb.png");
  2. url(“project:/Assets/Editor/Resources/thumb.png”);
  3. url(“project:///Assets/Editor/Resources/thumb.png”);
  4. 例如：background-image: url(“Images/my-image.png”)。
    对于纹理，如果文件具有带@2x后缀，则会自动加载此文件以用于视网膜或高DPI屏幕。

关于加载的简单运用可以看我的Unity2019 UIElement 笔记（二）UXML元素介绍上
https://blog.csdn.net/qq_43500611/article/details/89604942 有个小案例

字符串

使用引号指定字符串值。例如：–my-property: “foo”

这篇关于Unity2019 UIElement 笔记（六）USS介绍上的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！


http://www.chinasem.cn/article/618713。

相关文章

性能测试介绍

性能测试介绍

性能测试是一种测试方法，旨在评估系统、应用程序或组件在现实场景中的性能表现和可靠性。它通常用于衡量系统在不同负载条件下的响应时间、吞吐量、资源利用率、稳定性和可扩展性等关键指标。 为什么要进行性能测试 通过性能测试，可以确定系统是否能够满足预期的性能要求，找出性能瓶颈和潜在的问题，并进行优化和调整。 发现性能瓶颈：性能测试可以帮助发现系统的性能瓶颈，即系统在高负载或高并发情况下可能出现的问题
阅读更多...
水位雨量在线监测系统概述及应用介绍

水位雨量在线监测系统概述及应用介绍

在当今社会，随着科技的飞速发展，各种智能监测系统已成为保障公共安全、促进资源管理和环境保护的重要工具。其中，水位雨量在线监测系统作为自然灾害预警、水资源管理及水利工程运行的关键技术，其重要性不言而喻。 一、水位雨量在线监测系统的基本原理 水位雨量在线监测系统主要由数据采集单元、数据传输网络、数据处理中心及用户终端四大部分构成，形成了一个完整的闭环系统。 数据采集单元：这是系统的“眼睛”，
阅读更多...
Hadoop数据压缩使用介绍

Hadoop数据压缩使用介绍

一、压缩原则 （1）运算密集型的Job，少用压缩 （2）IO密集型的Job，多用压缩 二、压缩算法比较 三、压缩位置选择 四、压缩参数配置 1）为了支持多种压缩/解压缩算法，Hadoop引入了编码/解码器 2）要在Hadoop中启用压缩，可以配置如下参数
阅读更多...
图神经网络模型介绍（1）

图神经网络模型介绍（1）

我们将图神经网络分为基于谱域的模型和基于空域的模型，并按照发展顺序详解每个类别中的重要模型。 1.1基于谱域的图神经网络         谱域上的图卷积在图学习迈向深度学习的发展历程中起到了关键的作用。本节主要介绍三个具有代表性的谱域图神经网络：谱图卷积网络、切比雪夫网络和图卷积网络。 （1）谱图卷积网络 卷积定理：函数卷积的傅里叶变换是函数傅里叶变换的乘积，即F{f*g}
阅读更多...
【学习笔记】 陈强-机器学习-Python-Ch15 人工神经网络（1）sklearn

【学习笔记】 陈强-机器学习-Python-Ch15 人工神经网络（1）sklearn

系列文章目录 监督学习：参数方法 【学习笔记】 陈强-机器学习-Python-Ch4 线性回归 【学习笔记】 陈强-机器学习-Python-Ch5 逻辑回归 【课后题练习】 陈强-机器学习-Python-Ch5 逻辑回归（SAheart.csv） 【学习笔记】 陈强-机器学习-Python-Ch6 多项逻辑回归 【学习笔记 及 课后题练习】 陈强-机器学习-Python-Ch7 判别分析 【学
阅读更多...
系统架构师考试学习笔记第三篇——架构设计高级知识（20）通信系统架构设计理论与实践

系统架构师考试学习笔记第三篇——架构设计高级知识（20）通信系统架构设计理论与实践

本章知识考点：         第20课时主要学习通信系统架构设计的理论和工作中的实践。根据新版考试大纲,本课时知识点会涉及案例分析题(25分),而在历年考试中,案例题对该部分内容的考查并不多,虽在综合知识选择题目中经常考查,但分值也不高。本课时内容侧重于对知识点的记忆和理解,按照以往的出题规律,通信系统架构设计基础知识点多来源于教材内的基础网络设备、网络架构和教材外最新时事热点技术。本课时知识
阅读更多...
C++——stack、queue的实现及deque的介绍

C++——stack、queue的实现及deque的介绍

目录 1.stack与queue的实现 1.1stack的实现  1.2 queue的实现 2.重温vector、list、stack、queue的介绍 2.1 STL标准库中stack和queue的底层结构  3.deque的简单介绍 3.1为什么选择deque作为stack和queue的底层默认容器  3.2 STL中对stack与queue的模拟实现 ①stack模拟实现
阅读更多...
论文阅读笔记: Segment Anything

论文阅读笔记: Segment Anything

文章目录 Segment Anything摘要引言任务模型数据引擎数据集负责任的人工智能 Segment Anything Model图像编码器提示编码器mask解码器解决歧义损失和训练 Segment Anything 论文地址: https://arxiv.org/abs/2304.02643 代码地址:https://github.com/facebookresear
阅读更多...
数学建模笔记—— 非线性规划

数学建模笔记—— 非线性规划

数学建模笔记—— 非线性规划 非线性规划1. 模型原理1.1 非线性规划的标准型1.2 非线性规划求解的Matlab函数 2. 典型例题3. matlab代码求解3.1 例1 一个简单示例3.2 例2 选址问题1. 第一问 线性规划2. 第二问 非线性规划 非线性规划 非线性规划是一种求解目标函数或约束条件中有一个或几个非线性函数的最优化问题的方法。运筹学的一个重要分支。2
阅读更多...
【C++学习笔记 20】C++中的智能指针

【C++学习笔记 20】C++中的智能指针

智能指针的功能 在上一篇笔记提到了在栈和堆上创建变量的区别，使用new关键字创建变量时，需要搭配delete关键字销毁变量。而智能指针的作用就是调用new分配内存时，不必自己去调用delete，甚至不用调用new。 智能指针实际上就是对原始指针的包装。 unique_ptr 最简单的智能指针，是一种作用域指针，意思是当指针超出该作用域时，会自动调用delete。它名为unique的原因是这个
阅读更多...

Copyright China编程 23002807@qq.com

沪ICP备2023033072号-2