[FIXED] JavaFX - Check the position of a label based on a mouse click

Issue

I try to write a code that find the label on which one have clicked.

Using an event listener, I got the positions of the event using getX() and getY().

However, I cannot find the adequate methods for the label positions in order to compare them.

Below is my code, and its ouput.

public class Beta extends Application {

    final Label[] answerLabel = new Label[4];
    @Override
    public void start(Stage primaryStage) {
        GridPane root = new GridPane();
        root.setGridLinesVisible(true);
        final int numCols = 7 ;
        final int numRows = 12 ;
        
        //final Label[] answerLabel = new Label[4];
        
        for (int i = 0; i < numCols; i++) {
            ColumnConstraints colConst = new ColumnConstraints();
            colConst.setPercentWidth(100.0 / numCols);
            root.getColumnConstraints().add(colConst);
        }
        for (int i = 0; i < numRows; i++) {
            RowConstraints rowConst = new RowConstraints();
            rowConst.setPercentHeight(100.0 / numRows);
            root.getRowConstraints().add(rowConst);         
        }
                
        for(int i = 0; i<4; i++){
            answerLabel[i] = new Label();
            answerLabel[i].setMaxWidth(Double.MAX_VALUE);
            answerLabel[i].setMaxHeight(Double.MAX_VALUE);
            answerLabel[i].setStyle("-fx-background-color: blue;-fx-font-size: 7pt;-fx-padding: 0;");
            answerLabel[i].setPadding(new Insets(10)); 
            answerLabel[i].setCursor(Cursor.HAND);
            root.add(answerLabel[i], 3, i +5, 1, 1);
            
            answerLabel[i].setOnMouseClicked(new EventHandler<MouseEvent>() {
                @Override
                public void handle(MouseEvent e) {
                    answerLabelPressed(e);
                }
            });
        }
        
        primaryStage.setScene(new Scene(root, 900, 500));
        primaryStage.show();
    }

    private void answerLabelPressed(MouseEvent e)
    {

        int labelSelected;

        double px = e.getX();
        double py = e.getY();
        
        System.out.println("px = " + px + " py = " + py);
        
        for (labelSelected = 0; labelSelected < 4; labelSelected++)
        {
            
            System.out.println("answerLabel[labelSelected].getLayoutX() = " + answerLabel[labelSelected].getLayoutX());
            System.out.println("view.answerLabel[labelSelected].getLayoutY() = " + answerLabel[labelSelected].getLayoutY());
        }
    }   
   
    
    
    public static void main(String[] args) {
        launch(args);
    }
}

px = 42.0 py = 7.0
answerLabel[labelSelected].getLayoutX() = 386.0
view.answerLabel[labelSelected].getLayoutY() = 208.0
answerLabel[labelSelected].getLayoutX() = 386.0 
view.answerLabel[labelSelected].getLayoutY() = 250.0  
answerLabel[labelSelected].getLayoutX() = 386.0 
view.answerLabel[labelSelected].getLayoutY() = 292.0 
answerLabel[labelSelected].getLayoutX() = 386.0 
view.answerLabel[labelSelected].getLayoutY() = 333.0

Solution

I try to write a code that find the label on which one have clicked.

You create four labels, and you create a listener for each label. Each listener is only registered with one label.

So there is no need to get your hands dirty with the coordinates of the click (the event handling mechanism has already done all of that for you, when it decided to which node to dispatch the event). Just reference the label that was clicked:

public class Beta extends Application {

    final Label[] answerLabel = new Label[4];
    @Override
    public void start(Stage primaryStage) {
        GridPane root = new GridPane();
        root.setGridLinesVisible(true);
        final int numCols = 7 ;
        final int numRows = 12 ;
                    
        for (int i = 0; i < numCols; i++) {
            ColumnConstraints colConst = new ColumnConstraints();
            colConst.setPercentWidth(100.0 / numCols);
            root.getColumnConstraints().add(colConst);
        }
        for (int i = 0; i < numRows; i++) {
            RowConstraints rowConst = new RowConstraints();
            rowConst.setPercentHeight(100.0 / numRows);
            root.getRowConstraints().add(rowConst);         
        }
                
        for(int i = 0; i<4; i++){
            answerLabel[i] = new Label();
            answerLabel[i].setMaxWidth(Double.MAX_VALUE);
            answerLabel[i].setMaxHeight(Double.MAX_VALUE);
            answerLabel[i].setStyle("-fx-background-color: blue;-fx-font-size: 7pt;-fx-padding: 0;");
            answerLabel[i].setPadding(new Insets(10)); 
            answerLabel[i].setCursor(Cursor.HAND);
            root.add(answerLabel[i], 3, i +5, 1, 1);

            Label currentLabel = answerLabel[i];
            int currentIndex = i ;
            
            answerLabel[i].setOnMouseClicked(event -> {
                System.out.println("Clicked on label "+currentIndex);

                // just for demo: in real life use external stylesheets
                // and pseudoclasses, etc.
                for (Label label : answerLabel) {
                    label.setStyle("-fx-background-color: blue;-fx-font-size: 7pt;-fx-padding: 0;");
                }
                currentLabel.setStyle("-fx-background-color: gold;-fx-font-size: 7pt;-fx-padding: 0;");
            });
        }
        
        primaryStage.setScene(new Scene(root, 900, 500));
        primaryStage.show();
    }
}

Answered By - James_D
Answer Checked By - Timothy Miller (JavaFixing Admin)