How to give a preview of the currently drawn object with canvas?

Question

i am new to javafx and currently trying to make my first drawing program. So far its going ok but i have encountered a problem.

i want the user to see the size of the rectangle while its being drawn.

in the "setOnMouseDragged" method i tried to draw the current size of the rectangle and then clear it, so a preview is possible. unfortunately this prevents me from drawing another rectangle without it being cleared.

How can i make a preview but still draw multiple objects?

rootCenter.setOnMousePressed(new EventHandler<MouseEvent>() {

        @Override
        public void handle(MouseEvent event) {

            oldPosX = event.getSceneX();
            oldPosY = event.getSceneY();


        }
    });

    rootCenter.setOnMouseDragged(new EventHandler<MouseEvent>() {

        @Override
        public void handle(MouseEvent event) {

            newPosX = event.getSceneX();
            newPosY = event.getSceneY();

            gContext.clearRect(0, 0, canvas.getWidth(), canvas.getHeight());
            gContext.strokeRect(oldPosX, oldPosY, newPosX - oldPosX , newPosY -oldPosY);
        }
    });

    rootCenter.setOnMouseReleased(new EventHandler<MouseEvent>() {

        @Override
        public void handle(MouseEvent event) {
            gContext.strokeRect(oldPosX, oldPosY, newPosX - oldPosX , newPosY -oldPosY);

        }
    });

}

Answer 1

The canvas is just not the right tool for what you want to do. Why don't you use the scene graph instead? With the scene graph you do not even need any preview. You could just do your manipulations live. Have a look at the documentation here: https://docs.oracle.com/javafx/2/scenegraph/jfxpub-scenegraph.htm