动态修改Javafx中的内联CSS样式

Question

我试图在应用程序最大化时更改窗格的背景图像。我的背景是使用内嵌 css 设置的。我为样式设置了两个不同的变量和一个 if 语句。但是，我没有运气让它改变样式。

String cssStyle = "-fx-background-image: url(\'file:images/poker_table.png\');" +
                 "-fx-background-position: center center;" +
                 "-fx-background-radius: 15;" + // ************* For rounded corners
                 "-fx-background-size: 100% 100%;";
String cssStyle2 = "-fx-background-image: url(\'file:images/poker_table.jpg\');" +
                  "-fx-background-position: center center;" +
                  "-fx-background-radius: 15;" +
                  "-fx-background-size: 100% 100%;";
if (!primaryStage.isMaximized())
{   gameScreen.setStyle(cssStyle);
}
else
{   gameScreen.setStyle(cssStyle2);
}

Answer 1

只需向舞台的 maximizedProperty() 添加一个侦听器即可。属性和侦听器是 JavaFX API 的基本部分：您可以在 标准文档，或任何好的 JavaFX 教程。

primaryStage.maximizedProperty().addListener((obs, wasMaximized, isNowMaximized) -> {
    if (isNowMaximized) {
        gameScreen.setStyle(cssStyle2);
    } else {
        gameScreen.setStyle(cssStyle);
    }
});

您可能还需要立即使用已有的代码设置适当的样式。

如果您愿意，也可以使用绑定：

gameScreen.styleProperty().bind(Bindings.createStringBinding(
    () -> primaryStage.isMaximized() ? cssStyle2 : cssStyle,
    primaryStage.maximizedProperty()
);

绑定可以替换您已有的代码；它会立即应用，并且在 maxmizedProperty 发生变化时应用。