JavaFX blur whole window

Question

I am trying to implement something like modal popus in my application. To make them more clear, I decided to blur out whole window and place popus in front of it.

The problem is that JavaFX blurring creates artifacts when applied to a whole window:

Notice a white border — it should not exist.

---

My code is:

public void enableBlur() {
    ColorAdjust adj = new ColorAdjust(0, -0.9, -0.5, 0);
    GaussianBlur blur = new GaussianBlur(55); // 55 is just to show edge effect more clearly.
    adj.setInput(blur)
    rootPanel.setEffect(adj);
}

So the effect is applied to root content panel.

---

P.S. The question is not a duplicate of this since I think that provided solution suffers from the same edge effect, but it is not so clearly visible because the content of form is not so dark as here.

Answer 1

Set the fill of the Scene to the background color.

In the following example you can toggle between no fill (null) and the background color (Color.BLACK) (if you can find the button through that blur effect).

@Override
public void start(Stage primaryStage) {
    Button btn = new Button("If you can read this, the blur isn't working!");

    StackPane root = new StackPane();
    root.getChildren().add(btn);
    root.setStyle("-fx-background-color: black;");
    ColorAdjust adj = new ColorAdjust(0, -0.9, -0.5, 0);
    GaussianBlur blur = new GaussianBlur(55); // 55 is just to show edge effect more clearly.
    adj.setInput(blur);
    root.setEffect(adj);

    Scene scene = new Scene(root, 500, 200, null);

    btn.setOnAction((ActionEvent event) -> {
        scene.setFill(scene.getFill() == Color.BLACK ? null : Color.BLACK);
    });

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