Support for JavaFX 2 CSS in IntelliJ IDEA 12.1

Anna Kozlova

This is the second part of the serie about Java FX 2 support in the upcoming IntelliJ IDEA 12.1. Today we would show some features dedicated to help you to skin your JavaFX application with CSS. We would use the same sample application we were using in the previous post.

As you know JavaFX allows to configure stylesheets for nodes in your .fxml. IntelliJ IDEA helps to complete existing .css files:

You may rename, move, etc your .css file, the reference would be updated accordingly. If you deside to add one more stylesheet and want to convert attribute value to subtag, the IDE would also help you here.

Accepting intention Expand ‘stylesheets’ to tag would result in the following structure:

Given configured stylesheets file IDEA is able to complete registered style classes.

You can safely rename styleclasses, these references would be also updated accordingly. Of cause it is also possible to navigate from .fxml to corresponding stylesheets/styleclasses.

On the other hand you may want to skin the application right in .fxml and this is also possible (with all support which you may expect):

When no style is configured for the element, default styleclass would be used. It’s possible to modify it’s default content. Completion with default style classes is also available:

As you can see color gutter icon (and also color chooser) are also supported exactly the same way it is done in common .css.

When you need to skin more presicely you may want to set separate style class per node. It is possible to do so in JavaFX based on fx:id attribute. IntelliJ IDEA would suggest you to choose from all available id’s:

It’s also possible to get quick documentation for selected property.

That’s all for today. In the next post we’ll show how can IntelliJ IDEA help you to package your JavaFX Application.

Those who haven’t read the first part can find it here.

Feel free to share your feedback on the discussion forum and report bugs in our issue tracker.

Develop with Pleasure!

Subscribe to IntelliJ IDEA Blog updates

Subscribe form

By submitting this form, I agree to the JetBrains Privacy Policy Notification icon

By submitting this form, I agree that JetBrains s.r.o. ("JetBrains") may use my name, email address, and location data to send me newsletters, including commercial communications, and to process my personal data for this purpose. I agree that JetBrains may process said data using third-party services for this purpose in accordance with the JetBrains Privacy Policy. I understand that I can revoke this consent at any time in my profile. In addition, an unsubscribe link is included in each email.

Submit

Thanks, we've got you!