Sharing JavaFX css values across multiple classes

Question

How can I share settings across multiple classes? I need to apply certain styles to my tableview cells (depending on the enum value displayed) and would prefer not to repeat the values as below -

.A { 
    -fx-background-color: red;
}

.B { 
    -fx-background-color: red;
}

I have created one style class for each java enum present in my model. Some of these classes have the same settings. Hence my aim to reduce css duplication. This way I can set the string value of an enum as the style class. — Darth Ninja, Nov 15 '15 at 03:39

score 2 · Accepted Answer · answered Nov 13 '15 at 10:25

2

You can apply rules to multiple selectors with

.A, .B {
    -fx-background-color: red;
}

answered Nov 13 '15 at 10:25

James_D

201,275
16
291
322

score 0 · Answer 2 · answered Nov 13 '15 at 07:05

You should read the Skinning JavaFX Applications with CSS tutorial and the JavaFX CSS Reference Guide.

Excerpt:

You can create a class style by adding a definition for it to your style sheet. Example 5 defines a new style in controlStyle1.css called .button1.

Example 5 Define a New Style

.button1{
    -fx-text-fill: #006464;
    -fx-background-color: #DFB951;
    -fx-border-radius: 20;
    -fx-background-radius: 20;
    -fx-padding: 5;
}

To assign this class style to a node, use the getStyleClass().add() sequence of methods. Example 6 shows the .button1 style assigned to the Accept button.

Button buttonAccept = new Button("Accept");
buttonAccept.getStyleClass().add("button1");

Sharing JavaFX css values across multiple classes

2 Answers2