在運行的Java應用程序中更改CSS樣式的方法

Question

我正在使用JavaFX應用程序，該應用程序使用文件中包含的CSS樣式。 我想要的是在按鈕上發生動作后更改CSS樣式，並編寫了一些代碼，當我輸入/退出Button時，它會更改Button樣式：

public void actionMouseEntered() {
    buttonReflex1.getStyleClass().clear();
    buttonReflex1.getStyleClass().add("button_reflex_pressed");
    }
public void actionMouseExited(){
    buttonReflex1.getStyleClass().clear();
    buttonReflex1.getStyleClass().add("button_reflex");
}

這是我的CSS文件：

.button_reflex{
    -fx-shape: "M 200 *a lot of numbers here* Z";
    -fx-background-color: radial-gradient(focus-angle 360deg, focus-distance 0%, center 50% 50%, radius 70%, reflect, lightblue, aqua 30%, blue);
    -fx-text-fill: linear-gradient(#e4e000 0%, #ff0000 50%, #e4e000 100%);
}
.button_reflex_pressed{
    -fx-shape: "M 200 *a lot of numbers here* Z";
    -fx-background-color: radial-gradient(focus-angle 360deg, focus-distance 0%, center 50% 50%, radius 70%, reflect, dodgerblue, deepskyblue 30%, darkblue);
    -fx-text-fill: linear-gradient(#e4e000 0%, #ff0000 50%, #e4e000 100%);
}

它們的按鈕顏色不同。

我在WORKS上方編寫了代碼，但我認為我編寫的方式不是很好。 您能告訴我我實施該方法的方法是否正確，請告訴我我該如何做得更好，因為我不想學習不良習慣。

Answer 1

您不需要更改樣式類。 更改樣式類也不是解決此問題的最佳方法。 在這種情況下，應使用PseudoClass 。 另外，您應該避免復制沒有不同或僅顏色不同的css屬性。 為這兩者使用規則僅一次指定此名稱，以使其易於修改； 在后一種情況下，您可以使用查閱顏色：

private static final PseudoClass MY_HOVER = PseudoClass.getPseudoClass("my-hover");

...
buttonReflex1.getStyleClass().setAll("button-reflex");
...

    boolean hovering = ...;
    buttonReflex1.pseudoClassStateChanged(MY_HOVER, hovering);

.button-reflex {
    -fx-background-color1: lightblue;
    -fx-background-color2: aqua;
    -fx-background-color3: blue;
    -fx-shape: "M 200 *a lot of numbers here* Z";
    -fx-background-color: radial-gradient(focus-angle 360deg, focus-distance 0%, center 50% 50%, radius 70%, reflect, -fx-background-color1, -fx-background-color2 30%, -fx-background-color3);
    -fx-text-fill: linear-gradient(#e4e000 0%, #ff0000 50%, #e4e000 100%);
}

.button-reflex:my-hover {
    /* only change colors here; keep the rest */
    -fx-background-color1: dodgerblue;
    -fx-background-color2: deepskyblue;
    -fx-background-color3: darkblue;
}

注意： my-hover偽類僅在此處用於演示通用方法。 JavaFX Node默認情況下提供了一些偽類，應該使用它們來代替： hover ， pressed ，ect ...

請參閱《 JavaFX CSS參考指南：節點》

Answer 2

所以首先，是的，您可以在運行時更改CSS。

但是您以錯誤的方式使用它。

因此，如果您擁有Node的基本CSS類。 例如：

.button {
    -fx-background-color: red;
}

現在，如果您想對任何JavaFx Event產生影響，則可以使用諸如懸停，按下，聚焦...

.button {
   -fx-background-color: red;
}

.button:hover {
   -fx-background-color: blue;
}

.button:pressed{
   -fx-background-color: green;
}

JavaFx不僅可以為您處理所有事情，而且您無需手動更改樣式。