如何以编程方式同时将一种以上的样式应用于单个节点

Question

我正在用 JavaFX 创建一个计算器。我有一个带有 fx:ID #labelResult 的标签，采用 css 样式。现在我将键盘监听器添加到主窗格。因此，当我按下 Left/Right 箭头键时，我会将 #labelResult 的背景颜色更改为字符串 bgColors 数组中的颜色。我还添加了一个功能，可以在按下 上/下 箭头键时更改标签字体大小。现在的问题是。看来我不能同时应用这两种效果。因此，当我更改标签的背景颜色并触发更改字体大小机制时，字体大小效果将应用于标签，而 bg 颜色效果会重置。我怎样才能同时应用这两种效果？

P.S : 我使用 setStyle 方法在我的控制器中的两种情况下应用样式。

 CSS (before applying styles in my controller)

#labelRESULT {  
-fx-background-color: rgba(59, 74, 107, 0.8);
-fx-font-size: 45px;
-fx-text-fill: #fff;
}

Controller.java

@FXML
private Label labelRESULT;

@FXML
private void handleKeys(KeyEvent event) {
    int size = 45;
    String keyPressed = event.getCode().toString().toUpperCase();
    switch (keyPressed) {
        case "RIGHT":
            labelRESULT.setStyle("-fx-bg-color: #" + bgColors[1]);
            break;
        case "UP":
            labelRESULT.setStyle("-fx-font-size: " + (size + 2) + "px;");
            break;
    }
}

所发生情况的图片：http://imgh.us/javafx-calc.png

1- 在以编程方式应用样式之前

2-改变标签的bg颜色后

3-在更改bg颜色的同时更改标签的字体大小后

Answer 1

如果您将 getStyle() 的结果（即 bgColor）与其他样式（即 fontSize）连接起来，然后再次使用 setStyle()，也许会有所帮助？

EDIT 这将是另一个选项（在正确的位置将标志设置为 true 或 false）：

labelRESULT.pseudoClassStateChanged(PseudoClass.getPseudoClass("left-right-pressed"), flag);


labelRESULT.pseudoClassStateChanged(PseudoClass.getPseudoClass("up-down-pressed"), flag);

并在您的 css 中定义一个自定义伪类：

:left-right-pressed {
    -fx-background-color: yellow;
}

:up-down-pressed {
    -fx-font-size: 14;
}

Answer 2

您可以将 css 类添加/切换到您的节点。

JavaFXUtils.addClasses(node, "my-class-for-font");
JavaFXUtils.removeClasses(node, "my-class-for-color");