How to use awesome font in fxml project (javafx)

Question

I want to use a font in my project, but I have no idea how to use a font in my project.

I found some examples, but they cannot be used in fxml.

awesome javafx font

I need help how to use it in my project using fxml

Thanks.

Answer 1

I think this is what you need ControlFX, which include font support. see javadoc for more info (but I checked it once and it works fine)

Answer 2

I made use of the FA badges by adapting the Jens Deters approach .

Its routines target the dynamic composition of gui, which is the opposite of the declarative path fxml. However, its AwesomeIcon enum (which displays FA friendly names with Unicode characters) is perfect for my purposes.

It should start with static font loading in the main / app class:

public class App extends Application { static { Font.loadFont(App.class.getResource("/font/fontawesome-webfont.ttf").toExternalForm(), 10); } @Override public void start(final Stage primaryStage) throws Exception { URL resource = getClass().getResource("/fxml/app.fxml"); primaryStage.setScene(new Scene((Parent) FXMLLoader.load(resource), 500, 500)); primaryStage.setTitle("FontAwesomeFX demo"); primaryStage.show(); } public static void main(String... args){ launch(args); } } 

You cannot use unicode characters in fxml (specify FA badges if necessary), but can dynamically set attributes with these values. Therefore, having the above enumeration (AwesomeIcon), the work was done:

• Import:

   <?import de.jensd.fx.fontawesome.AwesomeIcon?> 

• node:

   <Label styleClass="awesome" style="-fx-font-family: FontAwesome; -fx-font-size: 16.0;"> <text><AwesomeIcon fx:constant="FILE"/></text> </Label> 

As a result, I create an Icon Widget / Control / Component to resume the amount of code with two properties:

• value: FA badge name;
• size: the styleable attribute for the -fx-font-size style on the label.

New code (same effect):

 <Icon value="FILE" size="16"/> 

The code for this control can be found here . You can also find a working example, as it includes a font and test code.

Answer 3

I ported the Android-Iconics library developed by Mike Penz to FX. Updates will come soon (also documents).

Showcase.jar will give you an overview of the icons.

Usage ( Java 1.8 required ):

 FxIconicsLabel labelTextDefault = (FxIconicsLabel) new FxIconicsLabel.Builder(FxFontGoogleMaterial.Icons.gmd_folder_special) .size(24) .text("Right (default)") .color(MaterialColor.ORANGE_500) .build(); 

(or see DialogPlayGround.java)

FxIconics on GitHub

Answer 4

If you are using SceneBuilder , try this.

• Download 'fontawesomefx' first .
• Secondly, import jar into SceneBuilder using SceneBuilder Jar / FXML Manager.
• Third, search the FontAwesomeIconView , GlyphCheckBox , MaterialDesignIconView , MaterialIconView or WeatherIconView

Sample FXML:

 <?xml version="1.0" encoding="UTF-8"?> <?import de.jensd.fx.glyphs.control.GlyphCheckBox?> <?import de.jensd.fx.glyphs.fontawesome.FontAwesomeIconView?> <?import de.jensd.fx.glyphs.materialdesignicons.MaterialDesignIconView?> <?import de.jensd.fx.glyphs.materialicons.MaterialIconView?> <?import de.jensd.fx.glyphs.weathericons.WeatherIconView?> <?import javafx.scene.control.Label?> <?import javafx.scene.layout.StackPane?> <?import javafx.scene.layout.VBox?> <StackPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/8.0.141" xmlns:fx="http://javafx.com/fxml/1"> <children> <VBox maxHeight="-Infinity" maxWidth="-Infinity"> <children> <Label text="FontAwesomeIconView"> <graphic> <FontAwesomeIconView /> </graphic> </Label> <Label text="GlyphCheckBox"> <graphic> <GlyphCheckBox /> </graphic> </Label> <Label text="MaterialDesignIconView"> <graphic> <MaterialDesignIconView /> </graphic> </Label> <Label text="MaterialIconView"> <graphic> <MaterialIconView /> </graphic> </Label> <Label text="WeatherIconView"> <graphic> <WeatherIconView /> </graphic> </Label> </children> </VBox> </children> </StackPane> 

Do not forget to add these banks to your path to the project!

Answer 5

You can use the fontawesomefx library using the .jar file in Scene Builder, and you can view all the available icons in the Fontawesome-fx Glyph browser.

Answer 6

You can use the fontawesomefx library and use it in FXML as follows:

Note: JavaFX 8 and FontAwesomeFx v8.9

dashboard.fxml

 <?xml version="1.0" encoding="UTF-8"?> <?import de.jensd.fx.glyphs.fontawesome.FontAwesomeIconView?> <?import javafx.scene.control.Button?> <?import javafx.scene.layout.AnchorPane?> <AnchorPane xmlns="http://javafx.com/javafx/8.0.121" xmlns:fx="http://javafx.com/fxml/1" fx:controller="com.example.DashboardController" prefHeight="760" prefWidth="1080"> <Button text="Close" AnchorPane.topAnchor="0" AnchorPane.leftAnchor="0"> <graphic> <FontAwesomeIconView glyphName="CLOSE" glyphSize="24"/> </graphic> </Button> </AnchorPane> 

In the scene, the builder looks like this: