Javafx 8, scenebuilder 2, and controlsfx with fontawesome?


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;
}
1
4
7/22/2014 8:00:07 AM

Accepted Answer

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.

3
12/12/2014 8:49:54 AM

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>
//...

Licensed under: CC-BY-SA with attribution
Not affiliated with: Stack Overflow
Icon