Creating Visual Effects in JavaFX
3 Applying Blur Effects
Blurring are common effects that can be used to provide more focus to selected objects. With JavaFX you can apply a boxblur, a motion blur, or a gaussian blur.
BoxBlur
The BoxBlur is a blur effect that uses a simple box filter kernel, with separately configurable sizes in both dimensions that control the amount of blur applied to an object, and an Iterations
parameter that controls the quality of the resulting blur.
Figure 3-1 shows two samples of blurred text.
Example 3-1 is a code snippet that uses the BoxBlur effect.
Example 3-1 BoxBlur Example
static Node boxBlur() { Text t = new Text(); t.setText("Blurry Text!"); t.setFill(Color.RED); t.setFont(Font.font("null", FontWeight.BOLD, 36)); t.setX(10); t.setY(40); BoxBlur bb = new BoxBlur(); bb.setWidth(5); bb.setHeight(5); bb.setIterations(3); t.setEffect(bb); t.setTranslateX(300); t.setTranslateY(100); return t; }
Motion Blur
A motion blur effect uses a Gaussian blur, with a configurable radius and angle to create the effect of a moving object.
Figure 3-2 shows the effect of the motion blur on a text.
Example 3-2 shows a code snippet that creates a motion blur effect with radius set to 15 and angle set to 45 in the sample application.
Example 3-2 Motion Blur Example
static Node motionBlur() { Text t = new Text(); t.setX(20.0f); t.setY(80.0f); t.setText("Motion Blur"); t.setFill(Color.RED); t.setFont(Font.font("null", FontWeight.BOLD, 60)); MotionBlur mb = new MotionBlur(); mb.setRadius(15.0f); mb.setAngle(45.0f); t.setEffect(mb); t.setTranslateX(300); t.setTranslateY(150); return t; }
Gaussian Blur
The Gaussian blur is an effect that uses a Gaussian algorithm with a configurable radius to blur objects.
Figure 3-3 shows the effect of the Gaussian blur on a text.
Example 3-3 shows a code snippet that blurs the text using Gaussian blur effect.