为什么 -fx-background-image 和 -fx-image 的 setStyle 不起作用？

Question

我不明白为什么我不能用这种方法改变图片（场的背景和imageview的图像）：

private void loginCheck(String loginText){
    String login = loginText.trim();
    if(login == null || login.equals("")) {
        loginField.setStyle("-fx-background-image:url('images/registration_login_wrong.png');");
        logoTick.setStyle("-fx-image:url('images/registration_wrong.png');");
        logoTick.setVisible(true);
    }else{
        loginField.setStyle("-fx-background-image:url('images/registration_login_right.png');");
        logoTick.setVisible(false);
    }
}

CSS logoTick 的代码是：

.login_tick{
-fx-image:url("images/registration_tick.png");
visibility:false;}

除了 -fx-image 和 -fx-background-image 之外的所有内容似乎都可以正常工作。我还更改了另一个 class（标签）中的背景图像，但没有遇到任何问题。这就是为什么我不明白什么可能是错误的。我检查了图像位置和名称，一切似乎都是正确的。如果我手动替换 CSS 中的图像路径它正在工作，但从代码图像中消失了。

Answer 1

CSSurl(...)函数中的路径被视为相对路径；它们相对的位置在样式表和内联样式中是不同的。来自 CSS documentation:

If the style appears in a stylesheet, the path is relative to the base URI of the stylesheet. If the style appears in an inline style, the path is relative to the root of the classpath.

在不知道您的项目布局的情况下，不可能为您提供正确的图像路径，但这应该足以让您弄明白。

备选方案

另一种解决方案是在 CSS 中定义所有样式，然后将 Java 代码中的样式 class 操作为 select 适当的样式。我喜欢使用 JavaFX 8 CSS PseudoClasses 来做到这一点：

.login-field:login-incorrect {
    -fx-background-image: url('images/registration_login_wrong.png');
}
.login-field:login-correct {
    -fx-image:url('images/registration_login_right.png');
}
.login_tick {
    -fx-image:url("images/registration_tick.png");
    visibility:false;
}
.login_tick:login-incorrect {
    -fx-image:url('images/registration_wrong.png');
    visibility: true ;
}

然后 Java 代码如下所示：

private void loginCheck(String loginText){
    String login = loginText.trim();
    boolean loginIncorrect = (login == null || login.equals("") ;

    PseudoClass loginIncorrectPsuedoClass = PseudoClass.getPseudoClass("login-incorrect");
    PseudoClass loginCorrectPsuedoClass = PseudoClass.getPseudoClass("login-correct");
    loginField.psuedoClassStateChanged(loginIncorrectPseudoClass, loginIncorrect);
    loginField.pseudoClassStateChanged(loginCorrectPseudoClass, !loginIncorrect);
    logoTick.psuedoClassStateChanged(loginIncorrectPseudoClass, loginIncorret);
}

这种方法的优点是所有样式信息都存储在CSS文件中； Java 代码只是更改 selector 用于 UI 元素。

为什么 -fx-background-image 和 -fx-image 的 setStyle 不起作用？

Why is setStyle for -fx-background-image and -fx-image not working?

background

javafx

image