How to move an existing Line shape in java using a mouse?-CodePudding

I would like to drag a selected line, but I'm unsure how to do it. I tried the following but it doesn't work and the line doesn't move correctly. What calculations am I missing?

var deltaX = mouseEvent.x - (line.startX   line.endX)
var deltaY = mouseEvent.y - (line.startY   line.endY)
line.startX  = line.startX   deltaX
line.startY  = line.startY  deltaY
line.endX = line.endX   deltaX
line.endY = line.endY  deltaY

CodePudding user response：

moving line with mouse

moving a line using mouse event

App.java

public class App extends Application {

    private double startX;
    private double startY;

    @Override
    public void start(Stage stage) throws Exception {
        Line line = new Line(0, 0, 0, 200);
        line.setStrokeWidth(3);
        Shape endHandler = new Circle(15, Color.BLUE);

        endHandler.setStroke(Color.BLACK);

        line.setOnMousePressed(e -> {

            startX = line.getLayoutX() - e.getX();
            startY = line.getLayoutY() - e.getY();

        });

        line.setOnMouseDragged(e -> {
            line.setTranslateX(line.getTranslateX()   e.getX());
            line.setTranslateY(line.getTranslateY()   e.getY());

        });

        Group group = new Group(line);
        group.setTranslateX(250);
        group.setTranslateY(250);

        Scene scene = new Scene(new AnchorPane(group), 500, 500);

        stage.setTitle("moving line");

        stage.setScene(scene);
        stage.show();
    }
}

CodePudding user response：

moving by binding start x y and end x y

In this aproach we are dragging circle shapes and the start and the end of line object will follow those shapes 'cause they are binded This is a functional single javafx app you can try . red circle is for start line position and blue is for end

public class App extends Application {

    @Override
    public void start(Stage stage) throws Exception {
        Line line = new Line(0, 0, 0, 200);
        Shape endHandler = new Circle(15, Color.BLUE);

        endHandler.setStroke(Color.BLACK);

        Shape startHandler = new Circle(15, Color.RED);

        startHandler.setStroke(Color.BLACK);

        endHandler.translateXProperty().bindBidirectional(line.endXProperty());
        endHandler.translateYProperty().bindBidirectional(line.endYProperty());

        startHandler.translateXProperty().bindBidirectional(line.startXProperty());
        startHandler.translateYProperty().bindBidirectional(line.startYProperty());

        endHandler.setOnMouseDragged(e -> {
            endHandler.setTranslateX(endHandler.getTranslateX()   e.getX());
            endHandler.setTranslateY(endHandler.getTranslateY()   e.getY());

        });
        startHandler.setOnMouseDragged(e -> {
            startHandler.setTranslateX(startHandler.getTranslateX()   e.getX());
            startHandler.setTranslateY(startHandler.getTranslateY()   e.getY());

        });

        Group group = new Group(line, endHandler, startHandler);
        group.setTranslateX(250);
        group.setTranslateY(250);

        Scene scene = new Scene(new AnchorPane(group), 500, 500);

        stage.setTitle("moving line");

        stage.setScene(scene);
        stage.show();
    }
}

CodePudding user response：

This code cancels out the start / end position. for

line.startX  = line.startX   deltaX
=
line.startX  = line.startX  (mouseEvent.x - (line.startX   line.endX))
= 
line.startX  = -line.endX mouseEvent.x

So now you dont even have the start position

You should have

var deltaX=mouseEvent.x
var deltaY = mouseEvent.y
line.startX  = line.startX   deltaX
line.startY  = line.startY  deltaY
line.endX = line.endX   deltaX
line.endY = line.endX  deltaY

Make sure the mouse Positions update