当鼠标悬停在JavaFX中的按钮上方时，如何创建节点（圆）？

Question

我有一个FXML文件，以及一个CSS文件和一个Controller.java文件。 当鼠标悬停在FXML文件的按钮上时，

例如fx:id="load"

如何在舞台上创建一个Circle节点？

我目前正在这样做：

注意：FXML和Controller链接在一起，并考虑了所有导入。

// FXML:

<Button fx:id="load" layoutX="146.0" layoutY="307.0" mnemonicParsing="false"\
onMouseEntered="#hoverEnterLoad" onMouseExited="#hoverExitLoad"\
prefHeight="26.0" prefWidth="93.0" stylesheets="@title.css" />

// Controller:

public Controller {

    @FXML private Button load;
    private Circle choose = new Circle(210.0, 278.0, 15.0, Color.TRANSPARENT);

    /**                                                                                                                                                                              
     * Shows circle                                                                                                                                                                
     */
    @FXML void hoverEnterLoad(ActionEvent event) {
        choose.setCenterX(210.0);
        choose.setCenterY(278.0);
        choose.setFill(Color.BLACK);
        choose.setRadius(15.0);
    } // hoverEnterLoad                                                                                                                                                               

    /**                                                                                                                                                                              
     * Hides circle                                                                                                                                                                
     */
    @FXML void hoverExitLoad(ActionEvent event) {
        choose.setFill(Color.TRANSPARENT);
    } // hoverExitLoad

} // Controller

Answer 1

您可以完全在FXML中完成此操作：

<Button fx:id="load" layoutX="146.0" layoutY="307.0" mnemonicParsing="false"\
onMouseEntered="#hoverEnterLoad" onMouseExited="#hoverExitLoad"\
prefHeight="26.0" prefWidth="93.0" stylesheets="@title.css" />
<Circle fx:id="selector" centerX="255.0" centerY="291.0" fill="BLACK" radius="5.0" stroke="TRANSPARENT" strokeType="INSIDE" visible="${load.hover}" />

Answer 2

我想到了。

将透明的Circle添加到FXML中，然后通过Controller.java对其进行编辑，而不是创建一个新的Circle。

// FXML:
// Added:

<Circle fx:id="selector" centerX="255.0" centerY="291.0" fill="TRANSPARENT" radius="5.0" stroke="TRANSPARENT" strokeType="INSIDE" />

// Controller:
// Added/Updated:

public Controller {

    @FXML private Button load;
    @FXML private Circle choose;

    /**                                                                                                                                                                              
     * Shows circle                                                                                                                                                                
     */
    @FXML void hoverEnterLoad(ActionEvent event) {
        choose.setCenterX(210.0);
        choose.setCenterY(278.0);
        choose.setFill(Color.BLACK);
        choose.setRadius(15.0);
    } // hoverEnterLoad                                                                                                                                                               

    /**                                                                                                                                                                              
     * Hides circle                                                                                                                                                                
     */
    @FXML void hoverExitLoad(ActionEvent event) {
        choose.setFill(Color.TRANSPARENT);
    } // hoverExitLoad

} // Controller

Answer 3

为什么不只使用给定的Button的hoverProperty？

circle.visibleProperty().bind(button.hoverProperty());

Answer 4

这可能更好。 特别是如果您要添加很多圈子。

public class FXMLDocumentController implements Initializable {

    @FXML private AnchorPane apMain;
    @FXML private Button load;
    Circle choose;




    @FXML void hoverEnterLoad(MouseEvent event) {
        choose = new Circle();
        choose.setCenterX(50.0);
        choose.setCenterY(50.0);
        choose.setFill(Color.BLACK);
        choose.setRadius(15.0);
        apMain.getChildren().add(choose);
        System.out.println("Mouse over button!");
    } // hoverEnterLoad                                                                                                                                                               

    /**                                                                                                                                                                              
     * Hides circle                                                                                                                                                                
     */
    @FXML void hoverExitLoad(MouseEvent event) {
        apMain.getChildren().remove(choose);
        System.out.println("Mouse no longer over!");
    } // hoverExitLoad

    @Override
    public void initialize(URL url, ResourceBundle rb) {
        // TODO
    }    

}