USS和UXML

  • USS
  • UXML


USS

USS (UIElements Style Sheets)是Unity的UI Toolkit中的一种样式表语言，用于定义UI元素的外观和布局。它是一种基于CSS的样式表语言，但是相比于CSS，它具有一些特定的语法和特性。

使用USS，可以通过将样式规则应用于UI元素来轻松地更改其外观和布局，从而使UI设计更加灵活和高效。USS支持诸如选择器、类、伪类、变量、函数、计算和嵌套规则等常见的CSS语法，也支持一些UI Toolkit特有的功能，例如锚点和网格布局等。

与CSS不同，USS具有一些针对UI Toolkit的特殊语法，例如像素对应单位，以及识别UI Toolkit特定的伪类和函数。USS还支持在运行时动态更改样式，这可以实现动态主题或用户自定义样式的实现。

总之，USS是一种强大的样式表语言，可以使UI设计师更加高效地创建和修改UI元素的样式和布局，同时也为开发人员提供了一种方便的方法来管理UI样式和主题。

/*C# type选择器:按钮元素*/
Button {
    border-radius: 33px;
    width: 100px;
}

/*Pseudo-Class(伪类) ":hover"*/
Button:hover {
    border-radius: 11px;
    width: 100px;
}

/*根伪类*/
:root {
    height: 300px;
}

/*name选择器:名为"Cancel"的元素*/
#Cancel {
    width: 190px;
    border-width: 2px;
    border-color: DarkRed;
    background-color: LightGreen;
}

/*class选择器:添加了此class的元素*/
.ClassName{
    background-color: yellow;
    height: 55px;
}

/*通用选择器*/
*{
    background-color: lightblue;
}

/*Descendant(后代)选择器(中间有个空格!):第一个选择器的结果,第二个选择器匹配其所有后代元素*/
#descendant1 .descendant2 {
    background-color: yellow;
}

/*Child选择器:第一个选择器的结果,第二个选择器只匹配其直接子节点元素*/
#child1 > .child2 {
    background-color: yellow;
}

/*Multiple选择器:选择满足所有选择器的元素*/
.multiple1.multiple2 {
    background-color: yellow;
}


UXML

UXML (UIElements XML)是Unity的UI Toolkit中的一种XML语言，用于创建和定义UI元素的层次结构和属性。与USS样式表不同，UXML专注于UI元素的结构和属性定义，而不是样式和布局。

使用UXML，可以通过定义XML元素和属性来构建UI界面。每个UXML元素都对应着UIElements库中的VisualElement类，其属性和子元素对应着VisualElement的属性和子元素。

UXML提供了类似HTML和XML的语法，其中包括元素、属性和值。与HTML和XML不同，UXML支持使用Unity引擎中定义的类型和枚举类型，例如Vector2和Color等。

与USS一样，UXML可以在运行时动态加载和修改，这使得UI界面的创建和修改变得更加灵活和高效。同时，UXML也可以与USS样式表相结合，从而实现更加复杂的UI设计和实现。

总之，UXML是一种用于构建和定义UI元素层次结构和属性的XML语言，它与UI Toolkit的VisualElement紧密结合，可以帮助UI设计师和开发人员更加高效地创建和修改UI界面。

同样的javaScript脚本也和Unity中使用C#脚本一样了，通过这些如果你学习过前端，那么你也可以熟练的使用这些来编辑你想要的UI了