Z-Ordering Issues with PerspectiveCamera and a Depth Buffer
1008920May 14 2013 — edited May 14 2013I am trying to implement a draggable reordering of Nodes in JavaFX and I have come across some issues with z-order when nodes overlap. I would like to have my application allow users to reorder components within a flow pane by dragging them with the mouse. I have the basics in place for doing this but have reached an impasse. When a user drags a component I am using Node.setTranslate* to glue the component to the mouse as it moves around the application. However this has the effect of sliding the Node around underneath some of the other nodes. I have tried to use Node.toFront to cause the moving Node to float above, however this has the side affect of reordering the children of the FlowPane the Nodes are contained within which is unacceptable for my situation. With that option not usable, I tried to use a PerspectiveCamera with the depth buffer enabled and apply a setTranslateZ(-value) to the moving Node to push it above the others, however this isn't working. If I set a negative Z value in the translate then the Node disappears and any positive Z value has no effect on the Nodes size or z-ordering. In examples on the net I have seen that people will add all of the objects that they want to make "3D" to a Group, is this required to make the perspective work? I have tried enable setDepthTest on both the flow pane and all of the movable Nodes. But that has no effect.
Here is the code for how I setup my Scene:
private Scene makeScene(Parent root) {
return SceneBuilder.create()
.width(960)
.height(600)
.depthBuffer(true)
.root(root)
.stylesheets("resources/style.css")
.camera(new PerspectiveCamera())
.build();
}
And here is where I move the nodes:
Node tp = (Node) event.getGestureSource();
Point2D p = new Point2D(tp.getLayoutX(),tp.getLayoutY());
double movX = event.getSceneX() - p.getX();
double movY = event.getSceneY() - p.getY();
tp.setTranslateX(movX - 30.0);
tp.setTranslateY(movY - 30.0);
tp.setTranslateZ(-100.0);