heky__ heky__ - 4 months ago 47
CSS Question

JavaFX Slider change width (thickness)

My problem is that the default

Slider
is too thin.
Is there a way to make the
Slider
(width) bigger?

Thanks for advice.

Answer

In JavaFX most of the styling can be done via CSS.

You can use the .slider .track and the .slider .thumb style classes in your CSS file. In this style classes you can use the -fx-pref-width and -fx-pref-height attributes:

.slider .track {
    -fx-pref-height:20;
}

.slider:vertical .track {
    -fx-pref-width:20;
}

.slider .thumb {
    -fx-pref-height: 30;
    -fx-pref-width: 30;
}

Or alternatively you can use the -fx-padding attribute:

.slider .track {
    -fx-padding: 10;
}

.slider .thumb {
    -fx-padding: 15;
}

This will produce horizontal and vertical Sliders like these:

enter image description here

In any case, you can refer to the JavaFX 8 default stylesheet (modena.css) and the JavaFX CSS Reference Guide.

You can also use the official tutorial about styling JavaFX with CSS.