|You can create a custom look, also called a skin, for your JavaFX application with cascading style sheets (CSS). CSS contain style definitions that control the look of user interface elements.
In this tutorial I am styling four buttons here to show how CSS works with JavaFX 2. As you can see from the code I define styles that are associated with a node through the node's ID. The ID is set using the node's setId() method and I apply style sheets to Scene. The style sheet test.css provides the skinning shown in the image below.
Here is the final result of our JavaFX 2 CSS: Styling Buttons example:
|JavaFX 2 CSS|
In order to style this application properly you'll need to create test.css file in /src folder of your project. That can be easily done by following these steps below:
- Right click on /src folder in Eclipse IDE Navigator, then select New, and then select File.
- Now just enter name of that file, in this case test.css
In this example I am styling buttons with gradients (radial, linear).
If you like this, and other JavaFX 2 tutorials on this blog, you can follow me on Twitter to be informed about new JavaFX tutorials, or you can take a look at these recommend tutorials:
If you have any comments, questions, and anything like that, please feel free to leave a comment below, or at least if you like this tutorial you can SHARE it with your friends.