Javafx 风格 - 继承不能直观地工作，-fx-text-fill 不能工作

Question

我是 JavaFX 新手，对样式感到困惑。我正在使用 OpenJFX 13.0.1。我有以下简单的场景：

val oscs = HBox()
val osc1 = VBox()
val title = Text("Osc 1")
title.styleClass.add("text")
osc1.children.add(title)
oscs.children.add(osc1)

val root = BorderPane()
root.children.add(oscs)
val scene = Scene(root, 500.0,  400.0)

我有两个问题：

1. -fx-text-fill 无法为文本着色，而-fx-fill 可以。 IE。

   .text {
       -fx-fill: #44FFFF;
   }
   

   有效，而：

   .text {
       -fx-text-fill: #44FFFF;
   }
   

   没有。根据文档，这似乎是错误的。

2. 继承没有像我预期的那样工作。子节点不应该从根继承吗？
   
   无论是-fx-fill 还是-fx-text-fill，以下内容都无法为标签着色。

   .root {
       -fx-font-size: 24px;
       -fx-font-family: sans-serif;
       -fx-fill: #44FFFF;  
       -fx-background-color: #000000;
       -fx-border-color: #44FF00;
       -fx-border-width: 2px;
   }
   

我做错了什么？

Answer 1

您可能对Label 和Text 感到困惑。

Text 是Shape 的子类，不提供-fx-text-fill 属性。此外，Shape 的-fx-fill 属性不会被继承。见CSS Reference Guide。

除了使用Label，您还可以使用后代选择器来分配填充：

.root .text {
    -fx-fill: #44FFFF;  
}

编辑：

Label 的-fx-text-fill 也没有被继承。您应该能够通过将inherit 指定为-fx-text-fill 或-fx-fill 属性的值来解决这两种情况。以下应该适用于Text：

.root {
    -fx-fill: #44FFFF;
    -fx-background-color: #000000;
}

.text {
    -fx-fill: inherit;
}