How-To's > How do I add a glow?

Use the Shadow class as the effect for a shape. To create an effective glow, use a color that is close to the color of the object but lighter.

Example Code

Ellipse {
    centerX: 100
    centerY:  50
    radiusX: 80
    radiusY: 30
    fill: Color.web("#80CAFA")  
    effect: Shadow {
        color:Color.web("#D8EFFD")
    }
    //cache:true
}

Tips

• Glow is useful for making an object more visible when it has a low contrast with the background. Alternately, glow can be used as a part of the aesthetics of the application UI.
• The radius variable defines how large you want the glow to be. In GUIs, the typical radius values for glow effects are small. The default value in the JavaFX Script programming language is 10.0.
• Effects can be expensive to render, and you can cache the node as a bitmap image by applying the variable cache:true. You have a tradeoff between speed of rendering the primitive shape and memory usage for the cached bitmap image. In general, it is beneficial to cache large static nodes or groups of nodes with effects applied.

API Documentation

• Glow

Last Updated: April 2010
[Return to How-To's Home]

---