JavaFX 2D text with background in 3D scene

问题:

For my project, I need 2D text inside a 3D scene (not as overlay!). So I've tried adding a BorderPane with Label/Text nodes to my scene:

The problem is however, that the white background of the panel is at times overlapping with the label (they have the same depth apparently) when I zoom in, out or fly around with my camera.

Is there a way to "elevate" the label from its panel? I've tried setting setDepthTest(true); with no effect.

Here is a simple example showing the problem. The Xform class is from the molecule sample of Oracle (http://docs.oracle.com/javase/8/javafx/graphics-tutorial/sampleapp3d-code.htm#CJAGGIFG):

package mypackage;

import mypackage.Xform;
import javafx.application.Application;
import javafx.scene.Group;
import javafx.scene.PerspectiveCamera;
import javafx.scene.Scene;
import javafx.scene.SceneAntialiasing;
import javafx.scene.layout.BorderPane;
import javafx.scene.paint.Color;
import javafx.scene.text.Text;
import javafx.stage.Stage;

public class Example  extends Application {

    private Stage primaryStage;
    private final Group root = new Group();

    @Override
    public void start(Stage primaryStage) throws Exception {
        this.primaryStage = primaryStage;
        primaryStage.setTitle("Example");
        this.primaryStage.setWidth(500);
        this.primaryStage.setHeight(500);

        Scene scene = new Scene(this.root, 500, 500, true, SceneAntialiasing.BALANCED);
        scene.setFill(Color.WHITESMOKE);

        Text text = new Text();
        text.setText("This is a text sample");
        text.setStyle("-fx-font-size: 20;");
        text.setCache(true);

        BorderPane borderPane = new BorderPane();
        borderPane.setStyle("-fx-border-color: black;-fx-background-color: #66CCFF;");
        borderPane.setTop(text);

        this.root.getChildren().add(borderPane);

        PerspectiveCamera camera = new PerspectiveCamera(true);
        camera.setNearClip(0.1);
        camera.setFarClip(10000.0);
        camera.setTranslateX(100);
        camera.setTranslateZ(-500);

        Xform cameraXform = new Xform();
        Xform cameraXform2 = new Xform();
        Xform cameraXform3 = new Xform();

        cameraXform.getChildren().add(cameraXform2);
        cameraXform2.getChildren().add(cameraXform3);
        cameraXform3.getChildren().add(camera);
        //cameraXform3.setRotateZ(180.0);
        cameraXform.ry.setAngle(400.0); // 320
        cameraXform.rx.setAngle(20.0); // 40

        scene.setCamera(camera);

        this.primaryStage.setScene(scene);
        this.primaryStage.show();
    }

    public static void main(String[] args) {
        System.setProperty("prism.lcdtext", "false");
        System.setProperty("prism.text", "t2k");
        launch(args);
    }

}

回答1:

Since you are embedding the Text node in a styled border pane, and rendering both in the scene, setting also the cache for the border pane really helps.

borderPane.setCache(true);

You will go from this:

to this:

Also, you can set this hint, to improve resolution.

borderPane.setCacheHint(CacheHint.SCALE_AND_ROTATE);