Customising java8 radio buttons using scene builder 8.5.0

Question

I am trying to crate a program and colors are important to me , my question is how can i customise the radio button (Change the blue ring and change the selected Gray circle also the white ring)enter image description here

Answer 1

The easiest is to do the styling in css. You can have a look at the modena.css (base css file for javafx). Copy the parts you need to your css file and edit the values as you need.

https://gist.github.com/maxd/63691840fc372f22f470 -> from line 749

/*******************************************************************************
 *                                                                             *
 * RadioButton                                                                 *
 *                                                                             *
 ******************************************************************************/

.radio-button {
    -fx-label-padding: 0.0em 0.0em 0.0em 0.416667em; /* 0 0 0 5 */
    -fx-text-fill: -fx-text-background-color;
}
.radio-button > .radio,
.radio-button:focused > .radio  {
   -fx-background-radius: 1.0em; /* large value to make sure this remains circular */
   -fx-padding: 0.333333em; /* 4 -- padding from outside edge to the inner black dot */
}
.radio-button > .radio > .dot {
   -fx-background-color: transparent;
   -fx-background-radius: 1.0em; /* large value to make sure this remains circular */
   -fx-padding: 0.333333em; /* 4 -- radius of the inner black dot when selected */
}

Note that radiobutton extends other ui classes. The reference guide may help you understanding the hierarchy: https://docs.oracle.com/javase/8/javafx/api/javafx/scene/doc-files/cssref.html#radiobutton