我如何對FXML中的不同按鈕使用同一事件

Question

我正在談論的事件很簡單：用戶將光標移動到按鈕所在的位置時，它將更改為另一種顏色。 退出后，它將變回原始顏色。 我已經實現了這一點，我要問的是如何對每個按鈕進行編程以使用相同的兩個事件？ 請記住，每個按鈕的行為都不同，但是每個按鈕的事件都相同。

這是相關的代碼

我的FXML Controller類

package millionairetriviagame;

import java.net.URL;
import java.util.ResourceBundle;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.control.Button;
import javafx.scene.input.MouseEvent;
import javafx.scene.media.Media;
import javafx.scene.media.MediaPlayer;

public class MenulayoutFXMLController implements Initializable
{   
    @FXML private Button playButton;

    @Override
    public void initialize(URL url, ResourceBundle rb) 
    {
         Media gameIntroTheme = new Media(getClass().getResource("/millionairetriviagame/AudioFiles/GameIntroTheme.mp3").toExternalForm());
         MediaPlayer mediaPlayer = new MediaPlayer(gameIntroTheme);
         mediaPlayer.setAutoPlay(true);
         mediaPlayer.setVolume(0.1);
    }     

    @FXML private void changeNewColor(MouseEvent event)
    {
        playButton.setStyle("-fx-background-color: #0f69b4;");
    }

    @FXML private void backToOldColor(MouseEvent event)
    {
        playButton.setStyle("-fx-background-color: #346699;");
    }
}

我的FXML

<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.geometry.*?>
<?import javafx.scene.image.*?>
<?import javafx.scene.media.*?>
<?import javafx.scene.text.*?>
<?import javafx.scene.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<?import java.net.URL?>

<StackPane fx:id="MainMenu" xmlns:fx="http://javafx.com/fxml/1" fx:controller="millionairetriviagame.MenulayoutFXMLController">
    <stylesheets>
       <URL value="@ButtonLayout.css"/>
   </stylesheets>
     <children>      
         <ImageView>
             <image>
                <Image url="@ImageFiles/BlueBackgroundColor.jpg"/>
            </image>
        </ImageView>
        <VBox fx:id="MainMenuLayout"  spacing="20"  alignment="TOP_CENTER" > 
            <children>
                 <ImageView>
                     <image>
                        <Image url="@ImageFiles/MillionaireLogo1.png"/>
                    </image>
                </ImageView>
                 <Button fx:id="playButton" onMouseEntered="#changeNewColor" onMouseExited="#backToOldColor"  prefWidth="200" prefHeight="30" text="Play" styleClass="ButtonLayout">
                     <shape>
                        <javafx.scene.shape.Rectangle  width="200" height="30" arcHeight="30" arcWidth="30" />  
                    </shape>
                </Button>              
                 <Button fx:id="optionButton" prefWidth="200" prefHeight="30" text="Option" styleClass="ButtonLayout">
                     <shape>
                        <javafx.scene.shape.Rectangle  width="200" height="30" arcHeight="30" arcWidth="30" />  
                    </shape>
                </Button>
                 <Button fx:id="aboutTheGameButton" prefWidth="200" prefHeight="30" text="How to Play" styleClass="ButtonLayout">
                     <shape>
                        <javafx.scene.shape.Rectangle  width="200" height="30" arcHeight="30" arcWidth="30" />  
                    </shape>
                </Button>
                 <Button fx:id="exitButton"  prefWidth="200" prefHeight="30" text="Exit" styleClass="ButtonLayout">
                     <shape>
                        <javafx.scene.shape.Rectangle  width="200" height="30" arcHeight="30" arcWidth="30" />  
                    </shape>
                </Button>
            </children>
        </VBox>   
    </children> 
</StackPane>

Answer 1

只需使用CSS即可。 您根本不需要任何事件處理：

.button {
    -fx-background-color: #346699;
}
.button:hover {
    -fx-background-color: #0f69b4;
}