Dragging buttons in Javafx

Question

I have a button which I would like to drag it and after some time drop it. I searched online the most useful thing I came across was this link. Alike from the link provided I would like the button to be dragged wherever the cursor goes , only when the mouse button goes up the button should drop. How can this problem be solved?Thanks in advance

Answer 1

I managed to make a borderPane and put a button over it. The button gets dragged and released when you are releasing the mouse !

import javafx.application.Application;
import javafx.event.EventHandler;
import javafx.scene.Cursor;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.input.MouseEvent;
import javafx.scene.layout.BorderPane;
import javafx.stage.Stage;

public class ButtonDraggable extends Application {

    @Override
    public void start(Stage stage) throws Exception {
        BorderPane borderPane = new BorderPane();
        borderPane.setPrefSize(800, 600);
        final Button button = new Button("Drag ME !");

        final Delta dragDelta = new Delta();
        button.setOnMousePressed(new EventHandler<MouseEvent>() {
            @Override
            public void handle(MouseEvent mouseEvent) {
                // record a delta distance for the drag and drop operation.
                dragDelta.x = button.getLayoutX() - mouseEvent.getSceneX();
                dragDelta.y = button.getLayoutY() - mouseEvent.getSceneY();
                button.setCursor(Cursor.MOVE);
            }
        });
        button.setOnMouseReleased(new EventHandler<MouseEvent>() {
            @Override
            public void handle(MouseEvent mouseEvent) {
                button.setCursor(Cursor.HAND);
            }
        });
        button.setOnMouseDragged(new EventHandler<MouseEvent>() {
            @Override
            public void handle(MouseEvent mouseEvent) {
                button.setLayoutX(mouseEvent.getSceneX() + dragDelta.x);
                button.setLayoutY(mouseEvent.getSceneY() + dragDelta.y);
            }
        });
        button.setOnMouseEntered(new EventHandler<MouseEvent>() {
            @Override
            public void handle(MouseEvent mouseEvent) {
                button.setCursor(Cursor.HAND);
            }
        });

        borderPane.setCenter(button);

        Scene scene = new Scene(borderPane);

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

    }

    // records relative x and y co-ordinates.
    class Delta {
        double x, y;
    }

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

}

Feel free to comment, in case of any doubts !

-AA

Answer 2

Hey the above code didn't work for me this does.

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.Pane;
import javafx.stage.Stage;

public class ButtonDraggable extends Application{
    @Override
    public void start(Stage primaryStage){
        // button and pane are created
        Button btOK = new Button("OK");
        Pane pane = new Pane();
        // this code drags the button
        btOK.setOnMouseDragged(e -> {
        btOK.setLayoutX(e.getSceneX());
        btOK.setLayoutY(e.getSceneY());
         });
        // button added to pane and pane added to scene
        pane.getChildren().add(btOK);
        Scene scene = new Scene(pane,200, 250);
        primaryStage.setTitle("A Draggable button");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

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