CODEWITHSUNDEEP
csssvgjavafx-8fxml
user68883
user68883

Reputation: 838

How to style a SVG using CSS in javaFX FXML

I'm using SVG for an image in a button. But I'm not able to fill in color for it through CSS. Below is the code to render a button.

<Button  onAction="#closeApplication" >
<graphic>
 <SVGPath content="M10,16 10,0 0,8z" styleClass="button‐icon‐shape" />
</graphic>
</Button>

here is the css 

.button-icon-shape SVGPath{
   -fx-fill:  red;
}

Upvotes: 7

Views: 7213

Answers (2)

Pagbo
Pagbo

Reputation: 690

I am aware this is an old question but this OP solution is not the best one to my mind. If you encountered the same kind of problem, my advise is to read the JavaFX CSS Reference Guide (JFX 8) and especially the redirection to this selectors link.

The simplest solution here with the initial code was the following:

<Button onAction="#closeApplication">
    <graphic>
        <SVGPath content="M10,16 10,0 0,8z" styleClass="button-icon-shape" />
    </graphic>
</Button>

And the JavaFX CSS associated would be :

.button-icon-shape {
   -fx-fill:red;
}

Upvotes: 2

user68883
user68883

Reputation: 838

here is how it worked. I had to style the button and use the class to style the svg in the button.

<Button  onAction="#closeApplication" styleClass="closeButton">
        <graphic>
            <SVGPath content="M10,16 10,0 0,8z"  />
        </graphic>
</Button>

here is the css

.closeButton{

}
.closeButton SVGPath{
   -fx-fill:  red;
}

Upvotes: 2

Related Questions