属性选择器在 JavaFX 中如何工作？答案

【问题标题】：How do Attribute Selectors work in JavaFX?属性选择器在 JavaFX 中如何工作？
【发布时间】：2018-03-02 00:49:26
【问题描述】：

JavaFX 级联样式表 (CSS) 基于 W3C CSS 版本 2.1 [1]，并在当前版本 3 [2] 上添加了一些内容。

在 JCRG 中，他们经常直接链接到 W3C 的 CSS 参考指南，当他们谈论选择器时就是这种情况。

在 JCRG 中，他们提到了 Type Selectors、Class Selectors 和 ID Selectors——他们甚至说他们是 don't support structural pseudo-classes——但没有提到 Attribute Selectors。

如果 JavaFX 支持它们，它们是如何工作的？ JavaFX 认为属性是什么？我认为 CSS 引擎可能会查看 FXML 中的属性，但并非所有场景图都源自 FXML。

【问题讨论】：

FXML 属性只是在相应的对象上设置属性。本身没有“属性选择器”，但是当且仅当设置了某些属性时，某些节点才会设置伪类（这些属性记录在您链接的参考指南中）。所以底线是没有属性选择器的直接等价物，除非它们直接映射到伪类。当然，请注意，如果您需要支持基于属性的 CSS，您始终可以观察属性并设置/取消设置自定义伪类。
@James_D 这应该是一个答案，我测试过了，FXML 中没有属性选择器支持。
@pdem 是的，我是作为评论开始的，它有点成长......让我将其转换为答案。

标签： java javafx css-selectors javafx-css

【解决方案1】：

FXML 属性只是设置相应对象的属性。本身没有“属性选择器”，但是当且仅当设置了某些属性时，某些节点才会设置伪类（这些属性记录在您链接的参考指南中）。所以底线是没有属性选择器的直接等价物，除非它们直接映射到伪类。

当然，请注意，如果您需要支持基于属性的 CSS，您始终可以观察属性并设置/取消设置自定义伪类。因此，总是可以将属性选择器重铸为伪类。

所以，例如假设如果文本字段具有 "alignment=CENTER_RIGHT" 属性，则您想对其进行不同的样式设置。你可以这样做

TextField textField = new TextField();
PseudoClass rightAligned = PseudoClass.getPseudoClass("right-aligned");
textField.alignmentProperty().addListener((obs, oldAlignment, newAlignment) -> 
    textField.pseudoClassStateChanged(rightAligned, newAlignment == Pos.CENTER_RIGHT));

然后在你的 CSS 中你只需要

.text-field:right-aligned {
    /* style rules */
}

【讨论】：

感谢您的精彩解释。鉴于 JavaFX Structure != HTML Structure，使用自定义伪类而不是属性选择器似乎更直观。