Linking a CSS Style Sheet to JavaFx Scene Graph

The recommended way to link your CSS styles to a Scene Graph in your application is through the stylesheets variable.

Set your css paths relative to your application’s concrete class. This is the class that will extend Application. In the sample project pictured below, the Concrete Application Class is my Driver.java file.

For more information on working with CSS Style Sheets in JavaFX 2 applications please see my article on JavaDesk website. I provide an example where a user can swap Style Sheets dynamically using a ChangeListener.

Driver.java has the class declaration:

public class Driver extends Application {public static void main(String[] args) {
launch(args);
}@Override
public void start(Stage primaryStage) {}
}

Example 1: Connect to CSS Style Sheet in same Package

//Demonstrate in one long line of code.
scene.getStylesheets().add(this.getClass()
.getResource(“Styles.css”).toExternalForm());

//Break up into two lines of code.
String cssURL = this.getClass().getResource(“Styles.css”)
.toExternalForm();
scene.getStylesheets().add(cssURL);

//Replace this keyword with full URL of main class.
scene.getStylesheets().add(ui.Driver.class.getResource(“Styles.css”)
.toExternalForm());

Example 2: Connect to CSS Style Sheet in another Package

//Get a style sheet that is not in same package as Driver.
scene.getStylesheets().add(this.getClass().
getResource(“/cssStyles/base.css”).toExternalForm());

Example 3: Get Multiple CSS Style Sheets

//Use addAll() to attach several stylesheets.
String cssFile1 = this.getClass().getResource(“x.css”)
.toExternalForm();String cssFile2 = this.getClass().getResource(“Styles.css”)
.toExternalForm();String cssFile3 = this.getClass().getResource(“/cssStyles/base.css”)
.toExternalForm();scene.getStylesheets().addAll(cssFile1, cssFile2, cssFile3);