How do I create a JavaFX transparent stage with shadows on only the border?

by

I’ve been kind of curious for a while about how to achieve such a shadow effect where the shadow effect does not show through underneath translucent top content.

The solution I came up with was to use clipping on the shadow so that it only displays outside of the translucent content that it is shadowing.

bloodstage

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.*;
import javafx.scene.paint.Color;
import javafx.scene.shape.*;
import javafx.stage.*;
import org.scenicview.ScenicView;

// Java 8 code
public class ClippedShadow extends Application {

    private static final int shadowSize = 50;

    @Override public void start(final Stage stage) {
        stage.initStyle(StageStyle.TRANSPARENT);

        StackPane stackPane = new StackPane(createShadowPane());
        stackPane.setStyle(
                "-fx-background-color: rgba(255, 255, 255, 0.5);" +
                "-fx-background-insets: " + shadowSize + ";"
        );

        Scene scene = new Scene(stackPane, 450, 450);
        scene.setFill(Color.TRANSPARENT);
        stage.setScene(scene);
        stage.show();
    }

    // Create a shadow effect as a halo around the pane and not within
    // the pane's content area.
    private Pane createShadowPane() {
        Pane shadowPane = new Pane();
        // a "real" app would do this in a CSS stylesheet.
        shadowPane.setStyle(
                "-fx-background-color: white;" +
                "-fx-effect: dropshadow(gaussian, red, " + shadowSize + ", 0, 0, 0);" +
                "-fx-background-insets: " + shadowSize + ";"
        );

        Rectangle innerRect = new Rectangle();
        Rectangle outerRect = new Rectangle();
        shadowPane.layoutBoundsProperty().addListener(
                (observable, oldBounds, newBounds) -> {
                    innerRect.relocate(
                            newBounds.getMinX() + shadowSize,
                            newBounds.getMinY() + shadowSize
                    );
                    innerRect.setWidth(newBounds.getWidth() - shadowSize * 2);
                    innerRect.setHeight(newBounds.getHeight() - shadowSize * 2);

                    outerRect.setWidth(newBounds.getWidth());
                    outerRect.setHeight(newBounds.getHeight());

                    Shape clip = Shape.subtract(outerRect, innerRect);
                    shadowPane.setClip(clip);
                }
        );

        return shadowPane;
    }

    public static void main(String[] args) {
        launch(args);
    }
}

Related

This answer is kind of a follow on to some other questions on translucent windows and panes which had multiple parts, one of which I did not get around to implementing regarding: How to get a halo drop shadow effect on a translucent window? (this question)

More Related Contents:

  1. Loading new fxml in the same scene
  2. Adding a custom component to SceneBuilder 2.0
  3. JavaFX correct scaling
  4. JavaFX-11 with VSCode
  5. JavaFX ImageView without any smoothing
  6. Java 8 U40 TextFormatter (JavaFX) to restrict user input only for decimal number
  7. How to get stage from controller during initialization?
  8. How to create a modal window in JavaFX 2.1
  9. JavaFX TextField Auto-suggestions
  10. JavaFX Properties in TableView
  11. Mouse Events get Ignored on the Underlying Layer
  12. JavaFX deployment library not found in active JDK
  13. TableView: adjust number of visible rows
  14. One controller to 2 fxmls (JavaFX)
  15. How to get 2D coordinates on window for 3D object in javafx
  16. how to make transparent scene and stage in javafx?
  17. JavaFX module javafx.graphics
  18. JavaFX ComboBox change value causes IndexOutOfBoundsException
  19. JavaFx MediaPlayer “Could not create player!” error in Ubuntu 14.04
  20. JavaFX, Label null pointer exception
  21. How to return value from a stage before closing it?
  22. FXMLLoader getController returns NULL?
  23. TableView doesn’t commit values on focus lost event
  24. can not resolve symbol “javafx.scene.web”
  25. How can I open the default system browser from a java fx application?
  26. JavaFX – Filtered ComboBox
  27. Make JavaFX wait and continue with code
  28. How to add dynamic columns and rows to TableView in java fxml
  29. How to wait for user input on JavaFX application thread without using showAndWait?
  30. Make portion of a text bold in a JavaFx Label or Text

Leave a Comment