Controlsfx PopOver 样式和焦点

Question

我正在使用 Popover，它用作文本字段的类似工具提示的帮助显示。它包含一个 Label 和一个 TextArea 作为内容，并在用户输入文本字段时创建。（通过 FocusPropery.addListener ）

我应用样式使用：

popOver.getRoot().getStylesheets().add(...)

（在文档 documentation 中找到）

这适用于 TextArea，但仅部分适用于标签。

我的风格是这样的：

*{
    -tb-dark-grey: rgb(32,38,44);
}

.root {
   -fx-base: -tb-dark-grey;
   -fx-background: -tb-dark-grey;
   -fx-control-inner-background: -tb-dark-grey;
}

这在我的主 window 中非常有效。包括所有标签和文本区域。一切都是深蓝色背景和白色文本。然而，对于 Popover 中的标签，它仅将文本颜色更改为白色，但背景保持通常的浅灰色。

我尝试使用 TextArea 作为解决方法。这适用于样式。但它总是从文本字段中窃取焦点。这使得无法键入内容。禁用 TextArea 有效，但这会改变 TextArea 的样式。

我已经尝试应用 this other question 中的样式。我也试过找回焦点，但也没用。

popup.Show(this.inputField)
this.inputField.requestFocus(); // also tried this with Platform.runLater

Answer 1

您的问题应该是 Label 没有使用您在 .root 样式 class 中覆盖的任何颜色。根据 JavaFX CSS reference guide，您可以使用 fx-background-color.

设置 Label 的背景样式

将以下行添加到您的样式表中应该可以解决问题：

.label {
    -fx-background-color: -tb-dark-grey;
}

如果您想为标签设置不同的样式，您还可以通过创建自定义样式 class 为每个标签单独应用样式：

CSS:

.custom-label {
    -fx-background-color: -tb-dark-grey;
}

然后将其应用于特定标签：

Label label = new Label("I am a label");
label.getStyleClass().add("custom-label");

编辑： 您可能应该知道您的 TextArea 不会显示您在样式表中定义的确切颜色。如果您检查 Modena 样式表，它是 JavaFX 的默认主题和样式（描述了如何找到它 here）。您会发现 TextArea 内容如下 css：

.text-area .content {
    /*the is 1px less top and bottom than TextInput because of scrollpane border */
    -fx-padding: 0.25em 0.583em 0.25em 0.583em; /* 3 7 3 7 */
    -fx-cursor: text;
    -fx-background-color:
        linear-gradient(from 0px 0px to 0px 4px, derive(-fx-control-inner-background, -8%), -fx-control-inner-background);
    -fx-background-radius: 2;
}

如你所见。 TextArea 内容的背景颜色并不完全是您在样式表中定义的 -fx-control-inner-background，而是从 -fx-control-inner-background 派生的颜色到您想要的颜色的线性渐变。这对您来说甚至可能不会引起注意，但了解一下可能会很不错。

设置 TextArea 背景的颜色，这样就可以像这样完成您的颜色：

.text-area .content {
    -fx-background-color: tb-dark-grey;
}

Controlsfx PopOver 样式和焦点

Controlsfx PopOver style and focus

javafx

controlsfx