JavaFX ControlsFx添加自定义CSS (通知)

Question

我正在使用controlsfx库，特别是它的通知组件，但是它的默认CSS样式根本不适合我的应用程序样式，所以我尝试更改它。

我尝试使用本文Is there a way to change the built-in controlfx notification popup color?中提供的解决方案

所以：

String css = this.getClass().getResource("notificationpopup.css").toExternalForm();

primaryStage.getScene().getStylesheets().add(css);
Notifications.create().owner(primaryStage).(...).show();

CSS文件正在成功加载，添加到styleSheets中也没有错误，但是通知的样式保持不变。除了我的更改之外，我尝试将整个文件加载到库中使用的文件和简短的css文件中，并只使用我想要更改的内容。

我的css文件更改，以供参考：

.notification-pane .notification-bar > .pane {
-fx-background-color: linear-gradient(to top, #3e5151, #decba4);
-fx-padding: 0 7 0 7;

}

(就目前而言，我只是尝试将背景更改为我选择的渐变)

我还试图实现来自与其他controlsfx元素相关的问题的建议，但没有成功，即在调用show之后将url添加到styleSheeT中。

(我也尝试过，只是检查一下，粗暴地更改了库jar中的css，但不知怎么的，它也失败了，就像css中的css一样，没有任何错误，尽管我已经修改了jar并再次添加了它)。

由于所提供的解释很少，我不知道这里有什么问题。

在我的解决方案中，我还必须避免调用.owner()并将通知分配给特定的阶段，因为它在这个阶段中出现，而不是在其外部的屏幕上显示。也许可以通过将样式表添加到其他元素(而不是primaryStage )来解决这个问题？但就目前而言，即使将通知限制在某个阶段，我也无法实现任何css更改。

Answer 1

回答这个问题有点晚了。但是如果有人有这个问题，你可以用这两种方法来解决。

方法01

这个问题可能会发生，因为您在场景中使用了多个样式表。将您的notificationpopup.css css添加到列列表的开头。我没有确凿的证据证明那是如何解决这个问题的。但我认为这是因为样式表的排序。(覆盖样式表应该放在样式表数组列表中的原始样式表之后。它们之间不能有其他样式表。

String css = this.getClass().getResource("notificationpopup.css").toExternalForm();

primaryStage.getScene().getStylesheets().add(0, css);

方法02

Put！对css类属性很重要。前任：

.notification-bar > .pane {
    -fx-background-color: red !important;
    -fx-padding: 10 10 10 10 !important;
}

Answer 2

更改组件的css样式的两种可能的解决方案

1. 在控制器类中，调用getStyle()方法如下

Node.getStyle(“-fx-背景-颜色:线性-梯度(至顶部，#3e5151，#decba4 4)；-fx-填充:0 7 0 7；”；

使用该节点上css文件中的相同代码，可以直接对其进行样式设置并覆盖css值。

或

1. 在代码或fxml文件中为节点提供唯一的CSS ID，方法是

node.setId("myID")；

然后在css文件中为该标记编写所需的任何内容，如

#myID {

   -fx-background-color: red;

}