Include FontAwesomeFX Icons and Glyphs from FXML

Question

Sector 1 (The great FontAwesomeFX)

Mention that the JFXBadge is coming from the JFoenix Library, I found the code downloading their demo from github.

Back in the old time of FontAwesomeFX 8.5.0< i could include in the app icons using:

<?import de.jensd.fx.fontawesome.Icon?>
<?import com.jfoenix.controls.JFXBadge?>

<HBox spacing="20" style="-fx-padding: 0 0 0 50;">
                <children>
 <JFXBadge fx:id="badge1" styleClass="icons-badge" text="1">
     <Icon awesomeIcon="STAR" size="2em" style=";" styleClass="icon" />
  </JFXBadge>               
     </children>
</HBox>

Old solution:

The line you needed was:

<Icon awesomeIcon="STAR" size="2em" style=";" styleClass="icon" />

Now after several updates i added the newest jar (8.9) but i have no clue how to do this?

In plain java code you can do it using the answer from FontAwesomeFX - only rectangles displayed

Finally:

How can i include icons from FontAwesomeFX to the .fxml like above so i can live check them through SceneBuilder and i have not to do compile run dance.

Answers including ControlsFX will be also accepted :) , i need to include the icons either in one way or another.

An icon from the version 8.0.10:

An icon from the version 8.9.0 (Everything is different):

Sector 2 (The great ControlsFX)

A discussion for the code below from BitBucket.

It is 6:45 am I am trying with ControlsFX 8.40 and nothing works ..... :( omggggggggg :

<?import org.controlsfx.glyphfont.*?>
//...
<Label>
    <graphic>
        <Glyph fontFamily="FontAwesome" icon="PLUS" />
    </graphic>
</Label>
//...

I am getting a rectangle from the code above ...

@rvit34 I wanted to achieve the below answer , i used the old FontAwesome. It worked so i left it as is . But i am open to any recommendations . I don't think that JFXBadge supports the newest version of Font Awesome . — GOXR3PLUS, Mar 14 '17 at 16:28
Why did you not use `FontAwesomeIconView` instead of old `Icon`? — rvit34, Mar 14 '17 at 22:14
@rvit34 Can you provide an answer on it and how to add it on JFXBadge ? — GOXR3PLUS, Mar 15 '17 at 04:54

GOXR3PLUS · Answer 1 · 2016-12-12T09:22:33.657

I am adding this answer until someone answer the question.

I want to create the below which is a JFXBadge:

The old code i use(with FontAwesomeFX 8.0.10):

FXML Part:

<?import de.jensd.fx.fontawesome.Icon?>
<?import com.jfoenix.controls.JFXBadge?>

//..
<HBox spacing="20" style="-fx-padding: 0 0 0 50;">
                <children>
 <JFXBadge fx:id="badge1" styleClass="icons-badge" text="1">
     <Icon awesomeIcon="STAR" size="2em" style=";" styleClass="icon" />
  </JFXBadge>               
     </children>
</HBox>
//..

CSS part for the text(Top-RIGHT) and the actual ICON:

.icon{
    -fx-text-fill: #FE774D;
    -fx-padding: 10.0;
    -fx-cursor: hand;
}

.icons-badge .badge-pane {
    -fx-background-color:#ff4081;
    -fx-background-radius:23.0; 
    -fx-pref-width: 23.0;
    -fx-pref-height: 23.0;  
    -fx-alignment: center;
}

.icons-badge Label{
    -fx-font-weight: BOLD;
    -fx-font-size: 13.0px !important;
    -fx-text-fill: WHITE;
}

Include FontAwesomeFX Icons and Glyphs from FXML

1 Answers1

Linked