JavaFX, MouseEvent problems

Question

I am currently making a paint application and have created several tools which are working, but I encountered a problem when trying to create a "Draw straight line" tool

So I basically draw a line from point A to B and it works, the line is there, however, when I toggle my other tools (Draw circle, rectangle etc) the shapes are being drawn at the same time as the straight-line despite the "Draw Line" button being toggled off.

The code below will allow you to draw straight-lines and you can try toggling on and off the different buttons, the straight line will still be drawn when you drag the cursor across the pane.

Anyone know what kind of mistake I did, and any possible fixes and/or alternate solutions?

(The event handler is there so that I can select the drawn shapes change them later if needed, this code is a stripped-down version of my paint application)

public class DrawLine extends Application {


@Override
public void start(Stage primaryStage) {

    ToggleButton lineButton  =   new    ToggleButton    ("Draw Line");
    ToggleButton Button      =   new    ToggleButton    ("Button with no function");

    BorderPane pane = new BorderPane();
    ToolBar toolbar = new ToolBar();
    Scene scene = new Scene(pane, 1200, 800);
    pane.setLeft(toolbar);
    toolbar.getItems().addAll(lineButton, Button);


    // Draw Line
    scene.addEventHandler(MouseEvent.MOUSE_CLICKED, me -> { 
        if(lineButton.isSelected() & me.getButton().equals(MouseButton.PRIMARY) ) { 
            scene.setOnMousePressed(event -> {
                Line line = new Line();

                line.setStartX(event.getX());
                line.setStartY(event.getY());

                    scene.setOnMouseDragged(e->{

                        line.setEndX(e.getX());
                        line.setEndY(e.getY());
                        });

                    pane.getChildren().add(line);

                });
        }
    });


    primaryStage.setTitle("Paint App"); 
    primaryStage.setScene(scene);       
    primaryStage.show();                 
}

public static void main(String[] args) {
    launch();
}

}

Answer 1

You only check if the lineButton is selected inside the MOUSE_CLICKED (which is a press-then-release gesture, by the way) handler. Inside this handler you add a MOUSE_PRESSED handler and inside that handler you add a MOUSE_DRAGGED handler. You don't check if the lineButton is selected inside the MOUSE_PRESSED or MOUSE_DRAGGED handlers.

What this all means is that, after the if condition inside the MOUSE_CLICKED handler evaluates to true, you'll have a MOUSE_PRESSED and MOUSE_DRAGGED handler that operate independently of your MOUSE_CLICKED handler. Now, whenever you press any mouse button it will create a Line and add it to the parent. Then the newly added MOUSE_DRAGGED handler will alter the Line.

You're fortunate, in a way, that you're using the onXXX properties instead of using addEventHandler. The properties replace the old EventHandler when set. If that didn't happen (such as with addEventHandler) you'd have many (one more each time) EventHandlers drawing Lines.

You just need to register all the appropriate EventHandlers once and do the logic inside of them.

Here's a small example:

import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.control.ToggleButton;
import javafx.scene.control.ToggleGroup;
import javafx.scene.control.ToolBar;
import javafx.scene.input.MouseButton;
import javafx.scene.input.MouseEvent;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.Pane;
import javafx.scene.shape.Line;
import javafx.stage.Stage;

public class Main extends Application {

  private ToggleGroup toggleGroup;
  private ToggleButton lineBtn;

  private Group group;
  private Line currentLine;

  @Override
  public void start(Stage primaryStage) {
    toggleGroup = new ToggleGroup();
    lineBtn = new ToggleButton("Line");

    ToggleButton noneBtn = new ToggleButton("None");
    toggleGroup.getToggles().addAll(lineBtn, noneBtn);
    toggleGroup.selectToggle(noneBtn);

    group = new Group();

    BorderPane root = new BorderPane(new Pane(group), new ToolBar(lineBtn, noneBtn), null, null, null);
    root.getCenter().setOnMousePressed(this::handleMousePressed);
    root.getCenter().setOnMouseDragged(this::handleMouseDragged);
    root.getCenter().setOnMouseReleased(this::handleMouseReleased);

    primaryStage.setScene(new Scene(root, 800, 600));
    primaryStage.setTitle("Draw Shape Example");
    primaryStage.show();
  }

  private void handleMousePressed(MouseEvent event) {
    if (lineBtn.equals(toggleGroup.getSelectedToggle())
        && event.getButton() == MouseButton.PRIMARY) {
      currentLine = new Line(event.getX(), event.getY(), event.getX(), event.getY());
      group.getChildren().add(currentLine);
    }
  }

  private void handleMouseDragged(MouseEvent event) {
    if (currentLine != null) {
      currentLine.setEndX(event.getX());
      currentLine.setEndY(event.getY());
    }
  }

  private void handleMouseReleased(MouseEvent event) {
    if (currentLine != null 
        && currentLine.getStartX() == currentLine.getEndX()
        && currentLine.getStartY() == currentLine.getEndY()) {
      // The line has no length, remove it
      group.getChildren().remove(currentLine);
    }
    currentLine = null;
  }

}