在代码和事件处理程序上更改JavaFX的样式

如何解决在代码和事件处理程序上更改JavaFX的样式

我有两个问题让我有疑问。

1Q：假设我有一个按钮，然后通过SceneBuilder将按钮的样式设置为“-fx-border-color：#FFFFFF” 在fxml文件中。假设我也添加了其他样式。

当鼠标进入按钮时，我创建了一个事件。如果要创建效果，例如，当鼠标进入和退出鼠标时边框的颜色发生变化，则必须在事件中添加 setStyle 在参数中，放置所有我已经拥有的样式，并仅更改我想要的样式？例如：在 Button 中，我的样式是 a，b，c，-fx-border-color：＃FFFFFF，d，e 。为此，我将不得不这样做：Button.setStyle（“ a，b，c，-fx-border-color：#AAAAAA，d，e”）还是有更好的方法呢？

2Q：：在类似的情况下，如果我想在悬停时使按钮在Y轴上稍微上升一点，我是否必须为每个按钮创建一个不同的事件并通过SceneBuilder？例如：

@FXML
void onMouseEnterEvent(MouseEvent event) {
    button_NewProject.setLayoutY(button_NewProject.getLayoutY()-8);
}

我在上面创建了代码，然后意识到我实际上无法为所有按钮处理相同的事件，因为如果我这样做，则将鼠标悬停在单个按钮上时，所有按钮都会上升。我错了？我需要在这里做什么？

解决方法

这是一个可以帮助您的演示。如果您有一个按钮处理程序可以处理多个按钮，则需要使用event.getSource。 event.getSource将返回接受操作的按钮。

handleBtnOnAction演示程序是这个。

@FXML
    public void handleBtnOnAction(ActionEvent event) {
        Button tempButton = ((Button)event.getSource());
        System.out.println("You pressed button " + tempButton.getText() + "  - ID: " + tempButton.getId());
    }

完整代码

主要

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.stage.Stage;

/**
 *
 * @author sedrick (sedj601)
 */
public class JavaFXApplication6 extends Application {
    
    @Override
    public void start(Stage stage) throws Exception {
        Parent root = FXMLLoader.load(getClass().getResource("FXMLDocument.fxml"));
        
        Scene scene = new Scene(root);
        
        stage.setScene(scene);
        stage.show();
    }

    /**
     * @param args the command line arguments
     */
    public static void main(String[] args) {
        launch(args);
    }
    
}

控制器

import java.net.URL;
import java.util.ArrayList;
import java.util.Collections;
import java.util.List;
import java.util.ResourceBundle;
import java.util.concurrent.atomic.AtomicInteger;
import javafx.event.ActionEvent;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.control.Button;
import javafx.scene.layout.GridPane;

/**
 *
 * @author sedrick (sedj601)
 */
public class FXMLDocumentController implements Initializable {
    @FXML GridPane gpMain;
    
    int turn = 0;
    List<String> styles = new ArrayList();
    
    @FXML
    public void handleBtnOnAction(ActionEvent event) {
        Button tempButton = ((Button)event.getSource());
        System.out.println("You pressed button " + tempButton.getText() + "  - ID: " + tempButton.getId());
    }
    
    @FXML
    public void handleStartDemoBtnOnAction(ActionEvent event) {
        Button tempStartDemoButton = (Button)event.getSource();
        tempStartDemoButton.setText("Change Buttons' ID");
       
        Collections.shuffle(styles);//Changes the styles location in the list. 
        AtomicInteger counter = new AtomicInteger();
        gpMain.getChildren().forEach((node) -> {//get gridpane buttons
            System.out.println(((Button)node).getText() + ": " + styles.get(counter.get()));
            node.setId(styles.get(counter.getAndIncrement()));//Set the buttons CSS ID.
        });
    }
    
    @Override
    public void initialize(URL url,ResourceBundle rb) {
        // TODO
        styles.add("green");
        styles.add("round-red");
        styles.add("bevel-grey");
        styles.add("glass-grey");
        styles.add("shiny-orange");
        styles.add("dark-blue");
        styles.add("record-sales");
        styles.add("rich-blue");
        styles.add("big-yellow");
        styles.add("iphone");
        styles.add("ipad-dark-grey");
        styles.add("ipad-grey");
        styles.add("lion-default");
        styles.add("lion");
        styles.add("windows7-default");
        styles.add("windows7");
        styles.add("green");   
    }    
    
}

FXML

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.control.Button?>
<?import javafx.scene.layout.ColumnConstraints?>
<?import javafx.scene.layout.GridPane?>
<?import javafx.scene.layout.RowConstraints?>
<?import javafx.scene.layout.VBox?>

<VBox maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" spacing="10.0" xmlns="http://javafx.com/javafx/8.0.171" xmlns:fx="http://javafx.com/fxml/1" fx:controller="javafxapplication6.FXMLDocumentController">
   <children>
      <GridPane fx:id="gpMain" hgap="5.0" maxHeight="-Infinity" maxWidth="-Infinity" stylesheets="@main.css" vgap="5.0">
         <columnConstraints>
            <ColumnConstraints hgrow="SOMETIMES" maxWidth="200.0" minWidth="200.0" prefWidth="200.0" />
            <ColumnConstraints hgrow="SOMETIMES" maxWidth="200.0" minWidth="200.0" prefWidth="200.0" />
            <ColumnConstraints hgrow="SOMETIMES" maxWidth="200.0" minWidth="200.0" prefWidth="200.0" />
         </columnConstraints>
         <rowConstraints>
            <RowConstraints maxHeight="200.0" minHeight="200.0" prefHeight="200.0" vgrow="SOMETIMES" />
            <RowConstraints maxHeight="200.0" minHeight="200.0" prefHeight="200.0" vgrow="SOMETIMES" />
            <RowConstraints maxHeight="200.0" minHeight="200.0" prefHeight="200.0" vgrow="SOMETIMES" />
         </rowConstraints>
         <children>
            <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" onAction="#handleBtnOnAction" text="1" />
            <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" onAction="#handleBtnOnAction" text="2" GridPane.columnIndex="1" />
            <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" onAction="#handleBtnOnAction" text="3" GridPane.columnIndex="2" />
            <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" onAction="#handleBtnOnAction" text="4" GridPane.rowIndex="1" />
            <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" onAction="#handleBtnOnAction" text="5" GridPane.columnIndex="1" GridPane.rowIndex="1" />
            <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" onAction="#handleBtnOnAction" text="6" GridPane.columnIndex="2" GridPane.rowIndex="1" />
            <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" onAction="#handleBtnOnAction" text="7" GridPane.rowIndex="2" />
            <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" onAction="#handleBtnOnAction" text="8" GridPane.columnIndex="1" GridPane.rowIndex="2" />
            <Button maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" mnemonicParsing="false" onAction="#handleBtnOnAction" text="9" GridPane.columnIndex="2" GridPane.rowIndex="2" />
         </children>
      </GridPane>
      <Button maxWidth="1.7976931348623157E308" mnemonicParsing="false" onAction="#handleStartDemoBtnOnAction" prefHeight="100.0" text="Start Demo" />
   </children>
</VBox>

CSS

/*
    Code from http://fxexperience.com/2011/12/styling-fx-buttons-with-css/
*/

#green {
    -fx-background-color:
        linear-gradient(#f0ff35,#a9ff00),radial-gradient(center 50% -40%,radius 200%,#b8ee36 45%,#80c800 50%);
    -fx-background-radius: 6,5;
    -fx-background-insets: 0,1;
    -fx-effect: dropshadow( three-pass-box,rgba(0,0.4),5,0.0,1 );
    -fx-text-fill: #395306;
}
#round-red {
    -fx-background-color: linear-gradient(#ff5400,#be1d00);
    -fx-background-radius: 30;
    -fx-background-insets: 0;
    -fx-text-fill: white;
}
#bevel-grey {
    -fx-background-color: 
        linear-gradient(#f2f2f2,#d6d6d6),linear-gradient(#fcfcfc 0%,#d9d9d9 20%,#d6d6d6 100%),linear-gradient(#dddddd 0%,#f6f6f6 50%);
    -fx-background-radius: 8,7,6;
    -fx-background-insets: 0,1,2;
    -fx-text-fill: black;
    -fx-effect: dropshadow( three-pass-box,0.6),1 );
}
#glass-grey {
    -fx-background-color: 
        #c3c4c4,linear-gradient(#d6d6d6 50%,white 100%),#e6e6e6 45%,rgba(230,230,0) 50%);
    -fx-background-radius: 30;
    -fx-background-insets: 0,1;
    -fx-text-fill: black;
    -fx-effect: dropshadow( three-pass-box,3,1 );
}
#shiny-orange {
    -fx-background-color: 
        linear-gradient(#ffd65b,#e68400),linear-gradient(#ffef84,#f2ba44),linear-gradient(#ffea6a,#efaa22),linear-gradient(#ffe657 0%,#f8c202 50%,#eea10b 100%),linear-gradient(from 0% 0% to 15% 50%,rgba(255,255,0.9),0));
    -fx-background-radius: 30;
    -fx-background-insets: 0,2,0;
    -fx-text-fill: #654b00;
    -fx-font-weight: bold;
    -fx-font-size: 14px;
    -fx-padding: 10 20 10 20;
}
#dark-blue {
    -fx-background-color: 
        #090a0c,linear-gradient(#38424b 0%,#1f2429 20%,#191d22 100%),linear-gradient(#20262b,#191d22),radial-gradient(center 50% 0%,radius 100%,rgba(114,131,148,0));
    -fx-background-radius: 5,4,0;
    -fx-text-fill: white;
    -fx-effect: dropshadow( three-pass-box,1 );
    -fx-font-family: "Arial";
    -fx-text-fill: linear-gradient(white,#d0d0d0);
    -fx-font-size: 12px;
    -fx-padding: 10 20 10 20;
}
#dark-blue Text {
    -fx-effect: dropshadow( one-pass-box,1 );
}
#record-sales {
    -fx-padding: 8 15 15 15;
    -fx-background-insets: 0,0 0 5 0,0 0 6 0,0 0 7 0;
    -fx-background-radius: 8;
    -fx-background-color: 
        linear-gradient(from 0% 93% to 0% 100%,#a34313 0%,#903b12 100%),#9d4024,#d86e3a,radial-gradient(center 50% 50%,#c54e2c);
    -fx-effect: dropshadow( gaussian,0.75),1 );
    -fx-font-weight: bold;
    -fx-font-size: 1.1em;
}
#record-sales:hover {
    -fx-background-color: 
        linear-gradient(from 0% 93% to 0% 100%,#ea7f4b,#c54e2c);
}
#record-sales:pressed {
    -fx-padding: 10 15 13 15;
    -fx-background-insets: 2 0 0 0,2 0 3 0,2 0 4 0,2 0 5 0;
}
#record-sales Text {
    -fx-fill: white;
    -fx-effect: dropshadow( gaussian,#a30000,2 );
}
#rich-blue {
    -fx-background-color: 
        #000000,linear-gradient(#7ebcea,#2f4b8f),linear-gradient(#426ab7,#263e75),linear-gradient(#395cab,#223768);
    -fx-background-insets: 0,3;
    -fx-background-radius: 3,2;
    -fx-padding: 12 30 12 30;
    -fx-text-fill: white;
    -fx-font-size: 12px;
}
#rich-blue Text {
    -fx-effect: dropshadow( one-pass-box,0.8),1);
}
#big-yellow {
    -fx-background-color: 
        #ecebe9,0.05),linear-gradient(#dcca8a,#c7a740),linear-gradient(#f9f2d6 0%,#f4e5bc 20%,#e6c75d 80%,#e2c045 100%),linear-gradient(#f6ebbe,#e6c34d);
    -fx-background-insets: 0,9 9 8 9,9,10,11;
    -fx-background-radius: 50;
    -fx-padding: 15 30 15 30;
    -fx-font-family: "Helvetica";
    -fx-font-size: 18px;
    -fx-text-fill: #311c09;
    -fx-effect: innershadow( three-pass-box,0.1),1);
}
#big-yellow Text {
    -fx-effect: dropshadow( one-pass-box,0.5),1);
}
#iphone-toolbar {
    -fx-background-color: linear-gradient(#98a8bd 0%,#8195af 25%,#6d86a4 100%);
}
#iphone {
    -fx-background-color: 
        #a6b5c9,linear-gradient(#303842 0%,#3e5577 20%,#375074 100%),linear-gradient(#768aa5 0%,#849cbb 5%,#5877a2 50%,#486a9a 51%,#4a6c9b 100%);
    -fx-background-insets: 0 0 -1 0,1;
    -fx-background-radius: 5,4;
    -fx-padding: 7 30 7 30;
    -fx-text-fill: #242d35;
    -fx-font-family: "Helvetica";
    -fx-font-size: 12px;
    -fx-text-fill: white;
}
#iphone Text {
    -fx-effect: dropshadow( one-pass-box,-1 );
}
#ipad-dark-grey {
    -fx-background-color: 
        linear-gradient(#686868 0%,#232723 25%,#373837 75%,#757575 100%),linear-gradient(#020b02,#3a3a3a),linear-gradient(#9d9e9d 0%,#6b6a6b 20%,#343534 80%,#242424 100%),linear-gradient(#8a8a8a 0%,#262626 100%),linear-gradient(#777777 0%,#606060 50%,#505250 51%,#2a2b2a 100%);
    -fx-background-insets: 0,6;
    -fx-background-radius: 9,8,3;
    -fx-padding: 15 30 15 30;
    -fx-font-family: "Helvetica";
    -fx-font-size: 18px;
    -fx-font-weight: bold;
    -fx-text-fill: white;
    -fx-effect: dropshadow( three-pass-box,0.2),1);
}
#ipad-dark-grey Text {
    -fx-effect: dropshadow( one-pass-box,black,-1 );
}
#ipad-grey {
    -fx-background-color: 
        linear-gradient(#686868 0%,linear-gradient(#b9b9b9 0%,#c2c2c2 20%,#afafaf 80%,#c8c8c8 100%),linear-gradient(#f5f5f5 0%,#dbdbdb 50%,#cacaca 51%,#d7d7d7 100%);
    -fx-background-insets: 0,5;
    -fx-background-radius: 9,4;
    -fx-padding: 15 30 15 30;
    -fx-font-family: "Helvetica";
    -fx-font-size: 18px;
    -fx-font-weight: bold;
    -fx-text-fill: #333333;
    -fx-effect: dropshadow( three-pass-box,1);
}
#ipad-grey Text {
    -fx-effect: dropshadow( one-pass-box,white,1 );
}
#lion-default {
    -fx-background-color: 
        rgba(0,0.08),linear-gradient(#5a61af,#51536d),linear-gradient(#e4fbff 0%,#cee6fb 10%,#a5d3fb 50%,#88c6fb 51%,#d5faff 100%);
    -fx-background-insets: 0 0 -1 0,4;
    -fx-padding: 3 30 3 30;
    -fx-text-fill: #242d35;
    -fx-font-size: 14px;
}
#lion {
    -fx-background-color: 
        rgba(0,linear-gradient(#9a9a9a,#909090),linear-gradient(white 0%,#f3f3f3 50%,#ececec 51%,#f2f2f2 100%);
    -fx-background-insets: 0 0 -1 0,4;
    -fx-padding: 3 30 3 30;
    -fx-text-fill: #242d35;
    -fx-font-size: 14px;
}
#windows7-default {
    -fx-background-color: 
        #3c7fb1,linear-gradient(#fafdfe,#e8f5fc),linear-gradient(#eaf6fd 0%,#d9f0fc 49%,#bee6fd 50%,#a7d9f5 100%);
    -fx-background-insets: 0,2;
    -fx-background-radius: 3,1;
    -fx-padding: 3 30 3 30;
    -fx-text-fill: black;
    -fx-font-size: 14px;
}
#windows7 {
    -fx-background-color: 
        #707070,linear-gradient(#fcfcfc,#f3f3f3),linear-gradient(#f2f2f2 0%,#ebebeb 49%,#dddddd 50%,#cfcfcf 100%);
    -fx-background-insets: 0,1;
    -fx-padding: 3 30 3 30;
    -fx-text-fill: black;
    -fx-font-size: 14px;
}