[JavaFX] 자바fx background image styleClass로 변경

background image 설정하기

 

fxml Button 설정

 

<Button fx:id="btn" onAction="btnAction" styleClass="btnCss" />

 

 

• -fx-background-image: 백그라운드 이미지를 넣는다.
• -fx-background-radius: 버튼의 모서리를 각지게 만든다.
• -fx-background-position: 백그라운드 이미지의 가로, 세로 위치를 설정한다.
• -fx-background-repeat: 백그라운드 반복을 설정한다.

아쉬운 점은 백그라운드 이미지의 포지션을 내 마음대로 설정할 수가 없다.

웹처럼 백그라운드 포지션의 x, y 좌표를 설정할 수 없고, top, center, left, right 값으로만 설정이 가능하다.

 

.btnCss{
  -fx-background-color:linear-gradient("#ccc, #ddd");
  -fx-background-radius: 0;
  -fx-backgrond-image: url("image/icon.png");
  -fx-background-position: center center;
  -fx-background-repeat: no-repeat;
  -fx-cursor: hand;
}

 

 

styleClass 값 변경

• getStyleClass().clear() : 스타일 값을 초기화
• getStyleClass().add() : 클래스 추가

@FXML
private void btnAction(){
  startButton.getStyleClass().clear();
  startButton.getStyleClass().add("start");
  startButton.getStyleClass().addAll("start", "stop"); 
}