マウスが入っているときにオブジェクトの色を変更し、外に出たときに元の色に変更します。JavaFx

Question

Groupのルートがあり、Rectangleクラスの正方形、Polygonクラスの三角形、Circleクラスの円がそのグループに追加されました。これらの3つのオブジェクトは、すべて異なる色で構築されています。

タスク：マウスが特定のオブジェクト上にある場合、そのオブジェクトの色を変更します。マウスがそのオブジェクトから外れている場合、色は元に戻ります。ここで

は、私がやったことだ：

import javafx.application.Application; 
import javafx.event.EventHandler; 
import javafx.scene.Group; 
import javafx.scene.Scene; 
import javafx.scene.input.MouseEvent; 
import javafx.scene.paint.Color; 
import javafx.scene.shape.Circle; 
import javafx.scene.shape.Polygon; 
import javafx.scene.shape.Rectangle; 
import javafx.stage.Stage; 


public class ColouredShapes extends Application{ 
public static void main(String[] args) { 
    launch(args); 
} 

@Override 
public void start(Stage primaryStage) { 
    Group group = new Group(); 
    // square 
    Rectangle square = new Rectangle(40,40); 
    square.setFill(Color.BLUE); 
    // triangle 
    Polygon triangle = new Polygon(); 
    triangle.setLayoutX(80); 
    triangle.getPoints().addAll(
      40.0,0.0, 
      80.0,40.0, 
      0.0,40.0 
    ); 
    triangle.setFill(Color.RED); 
    //circle 
    Circle circle = new Circle(20); 
    circle.setLayoutX(240); 
    circle.setCenterY(20); 

    // ************** where everything happens ***************** 
    group.onMouseMovedProperty().set(new EventHandler<MouseEvent>() { 
     @Override 
     public void handle(MouseEvent event) { 
      System.out.printf("coordinate X: %.2f, coordinate Y: %.2f\n",event.getX(),event.getY()); 
      System.out.println(event.getSource()); 

      if (event.getSource() instanceof Rectangle) { 
       square.setFill(Color.MAGENTA); 
      } else square.setFill(Color.BLUE); 
     } 
    }); 


    group.getChildren().add(circle); 
    group.getChildren().add(triangle); 
    group.getChildren().add(square); 

    Scene scene = new Scene(group,700,500); 
    primaryStage.setScene(scene); 
    primaryStage.show(); 

} } 

問題がevent.getSource()戻りGroup@52d9d54c[styleClass=root]の結果ではなく、その子のクラスです。その結果、子供が特定できなくなり、マウスがその子供に入ったときに色が変わることはありません。

Answer 1

event.getSource()は、イベントをトリガーしたノード（この場合はGroup）を返します。これは、それがハンドラを登録したノードだからです。代わりに、個々のノードのそれぞれに

使用onMouseEnteredとonMouseExitedハンドラ：

import javafx.application.Application; 
import javafx.scene.Group; 
import javafx.scene.Scene; 
import javafx.scene.paint.Color; 
import javafx.scene.shape.Circle; 
import javafx.scene.shape.Polygon; 
import javafx.scene.shape.Rectangle; 
import javafx.scene.shape.Shape; 
import javafx.stage.Stage; 

public class ColoredShapes extends Application { 
    public static void main(String[] args) { 
     launch(args); 
    } 

    @Override 
    public void start(Stage primaryStage) { 
     Group group = new Group(); 
     // square 
     Rectangle square = new Rectangle(40, 40); 
     square.setFill(Color.BLUE); 
     // triangle 
     Polygon triangle = new Polygon(); 
     triangle.setLayoutX(80); 
     triangle.getPoints().addAll(40.0, 0.0, 80.0, 40.0, 0.0, 40.0); 
     triangle.setFill(Color.RED); 
     // circle 
     Circle circle = new Circle(20); 
     circle.setLayoutX(240); 
     circle.setCenterY(20); 

     registerHandler(square, Color.BLUE, Color.MAGENTA); 
     registerHandler(triangle, Color.RED, Color.MAGENTA); 
     registerHandler(circle, Color.BLACK, Color.MAGENTA); 

     group.getChildren().add(circle); 
     group.getChildren().add(triangle); 
     group.getChildren().add(square); 

     Scene scene = new Scene(group, 700, 500); 
     primaryStage.setScene(scene); 
     primaryStage.show(); 

    } 

    private void registerHandler(Shape s, Color defaultColor, Color hoverColor) { 
     s.setOnMouseEntered(e -> s.setFill(hoverColor)); 
     s.setOnMouseExited(e -> s.setFill(defaultColor)); 
    } 

} 

また、すべてのイベントハンドラを使用せずにこれを行うことができます。使用バインディングのどちらか：

square.fillProperty().bind(Bindings 
    .when(square.hoverProperty()) 
    .then(Color.MAGENTA) 
    .otherwise(Color.BLUE)); 

やCSSを使用した：

.square { 
    -fx-fill: blue ; 
} 
.square:hover { 
    -fx-fill: magenta ; 
} 

：外部CSSファイル内

square.getStyleClass().add("square"); 

、その後、