2016-12-14 87 views
0

我正在使用JavaFX創建計算器。我有一個標籤fx:ID #labelResult,用css風格。現在我添加了鍵盤監聽器到主窗格。所以,當我按左/右箭頭鍵我將#labelResult的背景顏色更改爲字符串bgColors數組中的顏色。我還添加了一個功能,用於更改標籤字體大小。上/下箭頭鍵被按下。現在的問題是。似乎我不能同時應用兩種效果。所以當我改變標籤的背景顏色並觸發改變字體大小的機制時,字體大小效果會被應用到標籤,而bg顏色效果會重置。我怎樣才能同時應用這兩種效果?如何以編程方式將多個樣式應用於單個節點

P.S:我使用setStyle方法在兩種情況下在我的控制器中應用樣式。

CSS (before applying styles in my controller) 

#labelRESULT { 
-fx-background-color: rgba(59, 74, 107, 0.8); 
-fx-font-size: 45px; 
-fx-text-fill: #fff; 
} 

Controller.java

@FXML 
private Label labelRESULT; 

@FXML 
private void handleKeys(KeyEvent event) { 
    int size = 45; 
    String keyPressed = event.getCode().toString().toUpperCase(); 
    switch (keyPressed) { 
     case "RIGHT": 
      labelRESULT.setStyle("-fx-bg-color: #" + bgColors[1]); 
      break; 
     case "UP": 
      labelRESULT.setStyle("-fx-font-size: " + (size + 2) + "px;"); 
      break; 
    } 
} 

發生了什麼圖片:http://imgh.us/javafx-calc.png

1-應用樣式之前編程

2-改變標籤的背景顏色後

3-而BG顏色改變

+0

時你'setStyle'你覆蓋所有以前的樣式。更好的解決方案是製作單獨的css文件並在類之間切換。 –

+0

@fabian謝謝,補充休息。 –

回答

0

也許它幫助,如果你有額外的樣式(即fontSize的)Concat的getStyle()的(即BGCOLOR)的結果,然後()再次使用的setStyle?

編輯,這將是另一種選擇(設置標誌爲true或false在正確的地方):

labelRESULT.pseudoClassStateChanged(PseudoClass.getPseudoClass("left-right-pressed"), flag); 


labelRESULT.pseudoClassStateChanged(PseudoClass.getPseudoClass("up-down-pressed"), flag); 

,並在你的CSS定義自定義僞類:

:left-right-pressed { 
    -fx-background-color: yellow; 
} 

:up-down-pressed { 
    -fx-font-size: 14; 
} 
+1

太棒了!連接工作得很好!不知道爲什麼我沒有想到這一點。再次感謝你= D –

+0

只是一個問題。現在我又遇到了一個問題。每當我更改背景顏色或文本大小時,(getStyle)字符串變得越來越大。是否可以替換同一類型的效果?就像我想用另一個替換背景效果不是每次將新效果追加到樣式表。 http://imgh.us/2016-12-14_15h31_07.png –

+0

@RafatRefai只是保存狀態的地方,並取代基於狀態的'style'。根據狀態no,只包含一個或兩個部分... – fabian

0

你可以只添加/開關CSS類到你的節點改變標籤的字體大小後。

JavaFXUtils.addClasses(node, "my-class-for-font"); 
JavaFXUtils.removeClasses(node, "my-class-for-color"); 
+0

我該怎麼做。你能提供代碼嗎?我更新了我的問題,包括我的控制器的一部分,你可以看一下嗎? –

+0

添加代碼來回答 –

+0

謝謝。另一個答案解決了我的問題。但我也會嘗試一下你的方法,看看它是否有效 –

相關問題