CODEWITHSUNDEEP
draggablejavafx-8pane
purring pigeon
purring pigeon

Reputation: 4209

Create a Sizeable Draggable Pane in JavaFX 8

I am attempting to create a "workspace" where users can open several containers to display distinct information. These need to be moveable and sizeable (ScrollPane for example).

I have successfully created the majority of the functionality - however one thing is really causing me issues and I am not able to figure out the issue.

I created the following class:

public class WorkspaceMoveableSizeablePane extends Pane
    public WorkspaceMoveableSizeablePane(Node view) {
        getChildren().add(view);
        init();
    }
    private void init() {
        ...set up the event handlers....

I attempt to use this pane by wrapping an existing pane like so in my WorkspaceController:

@FXML private openSampleWorkspaceNode() {
          FXMLLoader loader = new FXMLLoader();
    Parent node = loader.load(
    this.getClass().getResource("MyView.fxml").openStream());
    WorkspaceMoveableSizeablePane dn = new WorkspaceMoveableSizeablePane(node);
    pane.getChildren().add(dn);
}

When I open it this way - I can size my Pane and drag it, however the children on the "node" which is an anchor pane stay in their current positions rather than get hidden.

To correct this issue, I wrapped the AnchorPane in a ScrollPane in the FXML file. This allowed the resize to happen - and as expected the portions out of bounds were not visible and the scrollbars appeared, however the drag stopped. When I attempted to track the mouse dragged event, it actually didn't fire unless I was resizing the WorkspaceMoveableSizeablePane.

//Event Listener for MouseDragged
    onMouseDraggedProperty().set(event -> {
      System.out.println("You are in the Mouse Dragged Event");
        if(isTopSelected){
            dragPaneToNewLocation(event);
        }else if(isResizingHeight) {
            handleResizeHeight(event);
        }else if(isResizingWidth) {
            handleResizeWidth(event);
        }
    });

I reverted my FXML to AnchorPane and changed the WorkspaceMoveableSizeablePane as follows to see if that would help:

public class WorkspaceMoveableSizeablePane extends ScrollPane
    public WorkspaceMoveableSizeablePane(Node view) {
        setContent(view);
        init();
    }
    private void init() {
        ...set up the event handlers....

As before the resize worked, but the drag didn't. The mouse dragged event never fired. Additionally, my scroll pane was blank with nothing in it.

So I am at a loss on how to proceed with this attempt.

Is there a limitation on the event handlers of the ScrollPane? Is there a different event I should be listening for? Thanks!!

Upvotes: 1

Views: 2465

Answers (1)

purring pigeon
purring pigeon

Reputation: 4209

The issue was that the ScrollPane was trapping the MouseDragged event.

Added an Event Filter and all is good...

    addEventFilter(MouseEvent.MOUSE_DRAGGED, event -> {
        if(isTopSelected){
            dragPaneToNewLocation(event);
        }else if(isResizingHeight) {
            handleResizeHeight(event);
        }else if(isResizingWidth) {
            handleResizeWidth(event);
        }
    });

Upvotes: 2

Related Questions