css - 如何切换我想在 JavaFXML 按钮中看到的图像文件？

Question

我正在尝试在两种状态之间切换按钮。一种状态是显示红色圆圈的图像，另一种状态是显示蓝色圆圈的图像。当用户单击按钮时，它应该在状态之间切换。我在我的 css 中设置了样式以适应按钮：

#button-debit {
    -fx-background-image: url("images/redButton.jpg");     
}

#button-credit {
    -fx-background-image: url("images/blueButton.png");
}

为了看看这是否有效，我尝试通过这样做从红色转换为蓝色：

@FXML
  private void handledborcrBtn() {
    dborcrBtn.setId("button-credit");
  }

然而结果并不如预期。红色按钮图像与下方的蓝色按钮图像保持一致，但蓝色图像被分成几个部分。

我想我记得 javax Swing 的“重绘”方法，但 JavaFXML 似乎更复杂，我无法让它正常工作。

标签： cssjavafx

Answer 1

用 ToogleBotton 试试

.toggle-button {
  -fx-graphic: url('icons.jpg');
}

.toggle-button:selected {
  -fx-graphic: url('othericon.png');
}