[FIXED] JavaFX Button with transparent background

Issue

I have some classical Button in JavaFX with a box containing some text.

I need buttons without that box, just the text, and when I hover the button or click on the button with mouse, it shall change its color to different.

Solution

In JavaFX styling is done by using CSS.

.button{
    -fx-border-color: transparent;
    -fx-border-width: 0;
    -fx-background-radius: 0;
    -fx-background-color: transparent;
    -fx-font-family:"Segoe UI", Helvetica, Arial, sans-serif;
    -fx-font-size: 1em; /* 12 */
    -fx-text-fill: #828282;
}

.button:focused {
    -fx-border-color: transparent, black;
    -fx-border-width: 1, 1;
    -fx-border-style: solid, segments(1, 2);
    -fx-border-radius: 0, 0;
    -fx-border-insets: 1 1 1 1, 0;
}

.button:pressed {
    -fx-background-color: black;
    -fx-text-fill: white;
}

Add this code to a CSS file, save it to the directory where the source file of the control exists which contains you buttons. Then in this class:

getStylesheets().add(getClass().getResource("nameofyourcssfile.css").toExternalForm());

Then all of the buttons that that object contain will use this style-classes.

Modification on your need is straightforward.

Good tutorial to start: http://docs.oracle.com/javafx/2/css_tutorial/jfxpub-css_tutorial.htm

Answered By - DVarga