Как использовать одно и то же событие для разных кнопок в FXML

1

Событие, о котором я говорю, просто следующее: в тот момент, когда пользователь переводит курсор туда, где находится кнопка, он изменится на другой цвет. Как только он выйдет, он возвращается к исходному цвету. Я уже реализовал это, и все, о чем я спрашиваю, как я могу программировать каждую кнопку, чтобы использовать те же два события? Помните, что каждая кнопка будет вести себя по-другому, но это событие будет одинаковым для каждой кнопки.

Вот соответствующий код

Мой класс контроллера FXML

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>
Теги:
javafx
fxml
events

1 ответ

2
Лучший ответ

Просто сделайте это с помощью CSS. Вам вообще не нужна обработка событий:

.button {
    -fx-background-color: #346699;
}
.button:hover {
    -fx-background-color: #0f69b4;
}
  • 0
    что делает hover?
  • 0
    Он активен, когда курсор мыши находится над выбранным узлом. См документы
Показать ещё 4 комментария
Сообщество Overcoder
Наверх
Меню