Javafx 8, scenebuilder 2, and controlsfx with fontawesome? - javafx

Question

I'm relatively new to javafx, and have recently started a project using java 8 and javafx. I am using Scenebuilder 2.0 to build my javafx ui. I was wondering if anyone have managed to use fontawesome in scenebuilder? Currently I need to do this to add graphics to a label
levelLabel1.setGraphic(create(FontAwesome.Glyph.CHEVRON_RIGHT));
public static Node create(Glyph glyph) {
FontAwesome fontAwesome = new FontAwesome();
fontAwesome.fontColor(color);
Node result = fontAwesome.create(glyph.getChar());
result.setScaleX(SCALE);
result.setScaleY(SCALE);
return result;
}

Answer 1

You can use FontAwesomeFX 8.1, that have a simply way to do this.
With ControlsFx you need edit fxml file. (more info)
<?import org.controlsfx.glyphfont.*?>
//...
<Label>
<graphic>
<Glyph fontFamily="FontAwesome" icon="PLUS" />
</graphic>
</Label>
//...

Answer 2

You will have to create a custom component for it.
Then you will be able to load it there (but still not able to see the Glyph there) and will be able to set the glyphs easier:
Code available on gist
Main.java
import org.controlsfx.glyphfont.FontAwesome;
import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.layout.Pane;
import javafx.stage.Stage;
public class Main extends Application {
#Override
public void start(Stage primaryStage) throws Exception {
FALabel label = new FALabel();
label.setGlyph(FontAwesome.Glyph.ANDROID);
label.setValue("RoBOZUKU");
Pane p = new Pane();
p.getChildren().add(label);
Scene scene = new Scene(p);
primaryStage.setScene(scene);
primaryStage.show();
}
public static void main(String[] args) {
launch(args);
}
}
FALabel.java
import org.controlsfx.glyphfont.FontAwesome;
import org.controlsfx.glyphfont.FontAwesome.Glyph;
import javafx.fxml.FXMLLoader;
import javafx.scene.Node;
import javafx.scene.control.Label;
import javafx.scene.paint.Color;
public class FALabel extends Label{
private Color color;
private Glyph glyph;
public void setValue(String text){
this.setText(text);
this.setGraphic(create(getGlyph()));
}
public FALabel() {
FXMLLoader fxmlLoader = new FXMLLoader(getClass().getResource("FALabel.fxml"));
fxmlLoader.setRoot(this);
fxmlLoader.setController(this);
try {
fxmlLoader.load();
} catch (Exception exception) {
throw new RuntimeException(exception);
}
}
public Node create(Glyph glyph) {
FontAwesome fontAwesome = new FontAwesome();
fontAwesome.fontColor(getColor());
Node result = fontAwesome.create(glyph.getChar());
result.setScaleX(this.getScaleX());
result.setScaleY(this.getScaleY());
return result;
}
public Color getColor() {
return color;
}
public void setColor(Color color) {
this.color = color;
}
public Glyph getGlyph() {
return glyph;
}
public void setGlyph(Glyph fontAwesome) {
this.glyph = fontAwesome;
}
}
FALabel.fxml
<?xml version="1.0" encoding="UTF-8"?>
<?import java.lang.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>
<fx:root type="javafx.scene.control.Label" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1"/>
PS: I know this probably wasn't exactly what you are looking for, but scene builder is still very limited.
PS2: You can also create a custom component using the Font Awesome Icons and implementing then in a Pane ( AnchorPane, Pane, HBox) with a ImageView and a Label.