Where can I find a complete official reference on JavaFX CSS?

user_1526545 0
Viewed 209

When I want to change the background colour of my TextArea in JavaFX (with CSS), many people recommend "-fx-control-inner-background". But when I look up the Oracle's CSS reference there's no such a thing as "-fx-control-inner-background"! In fact nowhere, in the Internet I could find a reference on that and yet it works!

My question is where do these people discover this information? Why, for example, isn't -fx-background-color working instead?

javafx-textarea javafx-css javafx
2 Answers

Note that -fx-control-inner-background is not a CSS property, but a "looked-up color" (essentially a CSS variable) that is defined in the default stylesheet, modena.css.

To the best of my knowledge, there's no official documentation that describes the looked-up colors used by modena. The only resource I know for finding these is the source code, which quite carefully documents the purpose and use of these variables.

It is valid to be concerned about back-compatibility when relying on undocumented functionality. I'd make the following arguments, that alleviate this concern to some extent:

  • The design of modena.css makes it quite clear the intention is that the looked-up colors defined in there are intended to be a mechanism for easily theming an application, and as such are written as though they are an API
  • Using these looked-up colors is in widespread use in the JavaFX programming community, and removing them from modena.css in a subsequent version would break a lot of code and be met with substantial opposition from the community. As such, these form a "de-facto API".

  • The call

    setUserAgentStylesheet(Application.STYLESHEET_MODENA);

    in the Application subclass will ensure that modena is used as the default stylesheet, so if a new default stylesheet is defined for future JavaFX releases, this code will future-proof your application, under the "de-facto API" assumption in the previous bullet point. (Note this also gives the JavaFX team a way forward to create a new stylesheet without breaking existing code, which I think strengthens the "de-facto API" argument.)

So, on balance, I think relying on the looked-up colors that you can find in the modena.css source code is a safe approach.

user_21891270

I finally found out something useful that shifts my understanding of FXML CSS.

According to this reference, each node in the scene graph can have substructures. For example in our case, TextArea has a substructure called content. It's this content that we should be looking to change and not the entire textarea. In this case:

.text-area .content { -fx-background-color: red; }

works perfectly for me. In other words, we have a region (called content) drawn on the main node (textarea).

This also shows why many people would get only a, for example, red border when they try to change the background of an textarea to red. It's because that narrow border is the only part beneath the content visible to us.

Hope this helps ...

user_15265450
Related