Using the CSS API

The CSS API was introduced in JavaFX 8 and extended in JavaFX 9 and 10 with 11 new classes. It's located in the package javafx.css and provides the following functionality:

• Make your own styleable properties
• Introduce and support new pseudo-class states

In the following example, we'll add a new style class to control the Clock sample we wrote in the previous chapters.

Introducing ClockControl

Before adding a new style class, let's start by converting out Clock application into a ClockControl which can be used in any application like other JavaFX nodes.

It will not be a full-fledged Control, but a first step. We'll talk about making a real Controls in Chapter 10, Advanced Controls and Charts.

I've made the following changes in order to prepare for CSS handling:

• Made the ClockControl class extend BorderPane
• Moved all graphics initialization to the ClockControl constructor
• Simplified timing logic; the old one was needed to demonstrate the JavaFX API from Chapter 1, Stages, Scenes, and...