Tutorial : How to Create a Border Glow Effect in JavaFX

At IDRSolutions, our PDF Viewer (part of our JPedal Library) currently uses Java Swing to create the PDF Viewer interface. However, we are now also in the process of developing a JavaFX PDF Viewer, this involves mimicking our Swing PDF Viewer and producing the same Graphical Interface but with JavaFX 2.2 instead.

In this tutorial, I will be demonstrating how to produce a glowing border effect which you can apply to any JavaFX Node, see the desired effect below.

Swing Border Glow Effect

To achieve the glowing border effect in JavaFX we will be using the JavaFX class DropShadow, the key methods of the DropShadow class are setOffsetX and setOffsetY, manipulating these methods by a positive value will move the shadow right/up, manipulating them by a negative value will move them left/down. To create a uniform glow around the Node we want to use a value of 0f for both X and Y.

DropShadow borderGlow = new DropShadow();
borderGlow.setColor(Color.RED);
borderGlow.setOffsetX(0f);
borderGlow.setOffsetY(0f);

To change the width/height of the glow, you can use the following two DropShadow class methods setWidth and setHeight. For example, by manipulating the setHeight from 170 to 70 you can have the following two glow thicknesses.

setHeight(170);

setHeight(70);

To apply our DropShadow effect (borderGlow) we call the setEffect method on the node we wish to apply the borderGlow effect to. We do this like so :

node.setEffect(Effect);

So, to put all this together and create a border glow effect on our JavaFX Node, it’s as simple as writing the following code :

int depth = 70;  //Setting the uniform variable for the glow width and height

DropShadow borderGlow= new DropShadow();
borderGlow.setOffsetY(0f);
borderGlow.setOffsetX(0f);
borderGlow.setColor(Color.RED);
borderGlow.setWidth(depth);
borderGlow.setHeight(depth);

node.setEffect(borderGlow);  //Apply the borderGlow effect to the JavaFX node

Alas! we have the desired effect now written purely in JavaFX instead of Swing!  :

JavaFX Border Glow Effect

We also have a JavaFX PDF Viewer plugin for NetBeans which you can grab here.
For more information on Effects in JavaFX, visit Oracle website.

Thank you for reading! If you have a better way to add glowing borders, would like to share anything, or have any questions then please comment below!