I'm attempting to create a button that toggles between displaying an image of a red circle and an image of a blue circle when clicked. In my CSS, I've set up styles for the different states of the button:
#button-debit {
-fx-background-image: url("images/redButton.jpg");
}
#button-credit {
-fx-background-image: url("images/blueButton.png");
}
In order to test this functionality, I've tried simply transforming the button from red to blue like this:
@FXML
private void handledborcrBtn() {
dborcrBtn.setId("button-credit");
}
Unfortunately, the result is not what I expected. The red button image remains in place with the blue one underneath it, but the blue image appears split into several parts.
I vaguely recall a 'repaint' method from javax Swing, however, JavaFXML seems more complex and I'm struggling to get it working correctly.