JavaFX custom Fonts

Question

Actually searched everywhere but any answer can't help me, sohere's the problem: I want to add a custom font to my buttons. I already tried to write a css java class and a lot of other solutions, but nothing helped my.

/code deleted/

I'd be so glad if anyone could help me!

Update: I tried this:

package view;
import ...
public class SceneStyle {

ImageView header = new ImageView("/view/images/header.jpg");
ImageView chatImg = new ImageView("/view/images/chat_win.jpg");

//Layout Style
//public String font1 = "Impact";
//public String font2 = "Comic Sans MS";
public static String color1 = "#00adf0"; 
public static String color2 = "#0076a3"; 

public void setLabelStyle(Label label) {
    label.setStyle("-fx-font-family: Inconsolata:700; -fx-font-size: 25");
    Scene scene = new Scene(label);
    scene.getStylesheets().add("https://fonts.googleapis.com/css?family=Inconsolata:700");
    label.setTextFill(Color.GRAY);
}

public void setLabelStyle2(Label label){
    label.setStyle("-fx-font-family: Inconsolata:700; -fx-font-size: 25");
    Scene scene = new Scene(label);
    scene.getStylesheets().add("https://fonts.googleapis.com/css?family=Inconsolata:700");
    label.setTextFill(Color.GRAY);
}

public void setLabelStyle3(Label label){
    label.setStyle("-fx-font-family: Inconsolata:700; -fx-font-size: 25");
    Scene scene = new Scene(label);
    scene.getStylesheets().add("https://fonts.googleapis.com/css?family=Inconsolata:700");
    label.setTextFill(Color.RED);
}

public void setButtonStyle(Button button){
    button.setStyle("-fx-font-family: Inconsolata:700; -fx-font-size: 30; -fx-font-style: normal");
    Scene scene = new Scene(button);
    scene.getStylesheets().add("https://fonts.googleapis.com/css?family=Inconsolata:700");
    button.setTextFill(Color.web(color2));
    button.setPrefWidth(190);
}

public void setBorderPaneStyle(BorderPane pane, VBox btnBox, HBox scoreBox){

    pane.setTop(header);
    pane.setLeft(btnBox);
    pane.setRight(chatImg);
    pane.setBottom(scoreBox);
    pane.getLeft().setStyle("-fx-background-image: url(\"/view/images/border_left.jpg\");");
    pane.getBottom().setStyle("-fx-background-image: url(\"/view/images/bottom.jpg\");");
    //pane.getCenter().setStyle("-fx-background-image: url(\"/view/images/center.jpg\");");
    //TODO: why can't I implement this?
}

public static String getFontColor1(){ return color1; }
public static String getFontColor2(){ return color2; }

Thanks for the detailed answers, but actually I don't want to write a start method which is overwritten. Just want to implemtent the font in my code. And yes now I'm trying with the Google Fonts. Thanks for answering my question.

The @font-face doesn't worked for me every time I tried it. You have to load the font over your Code with Font.loadFont(...). And then you can use it over your css. — Marcel, Oct 26 '15 at 08:40
You can try using this [small example](https://github.com/TheItachiUchiha/FontLoad) which uses `@font-face` to load a new font file and then applies it to button and label controls. — ItachiUchiha, Oct 26 '15 at 08:49
There is an [fxexperience blog on using Google hosted fonts](http://fxexperience.com/2012/12/use-webgoogle-fonts-in-javafx/) defined using CSS `@font-face`. — jewelsea, Oct 26 '15 at 23:46
You mention that you don't want to write a start method which is overwritten. However, you need such a method in a pure [JavaFX Application](https://docs.oracle.com/javase/8/javafx/api/javafx/application/Application.html), otherwise you will be unable to get JavaFX do to anything, it would not even [say "hello, world"](https://docs.oracle.com/javase/8/javafx/get-started-tutorial/hello_world.htm) without a start method. — jewelsea, Oct 26 '15 at 23:47
You only need to add a stylesheet for a given font once for your application. You don't need to add the same css stylesheet every time you add an element (e.g. every button and every label) to your UI. You also don't need to create a new scene for each element, you usually just have a single scene that you add all of your visible elements to. — jewelsea, Oct 26 '15 at 23:53
Well, yes of course. I have a start-Method in the main class. — Viktoria, Oct 27 '15 at 00:43

score 13 · Answer 1 · edited Jun 04 '19 at 14:35

Here is a simple example of how to use custom fonts in your JavaFX application. This example is just an edited version of the sample FontLoad application.

Output

Project Structure

The follow diagram is the project structure.

Java Class

import javafx.application.Application;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.layout.VBox;
import javafx.stage.Stage;

public class FontLoad extends Application {
    @Override
    public void start(Stage primaryStage) throws Exception {
        Label label = new Label("JavaFX Application");
        Button button = new Button("My Button");
        VBox box = new VBox(15, label, button);
        box.setAlignment(Pos.CENTER);
        Scene scene = new Scene(box, 500, 300);
        scene.getStylesheets().add(getClass().getResource("/fontstyle.css").toExternalForm());
        primaryStage.setScene(scene);
        primaryStage.show();
    }

    public static void main(String[] args) {
        launch(args);
    }
}

Stylesheet

@font-face {
    font-family: 'Fleftex';
    src: url('fonts/Fleftex_M.ttf');
}

.label {
    -fx-font-family: 'Fleftex';
    -fx-font-size: 20;
}

.button .text {
    -fx-font-family: 'Fleftex';
}

Update >= 8u60

Starting with this version the attribute “font-family” is ignored and you have to use the real name of the TTF.

By example: to use the font “Fleftex” contained on the file Fleftex_M.ttf You have to use this CSS file :

@font-face {
src: url(“fonts/Fleftex_M.ttf”);
}

.label {
-fx-font-family: 'Fleftex';
}

Probably something people may not see here is that it's not by accident that the `@font-face` comes first in the css file. This is actually where it needs to be to work, otherwise it would be ignored. Learned this after an hour of painstaking search to find out why my fonts were being ignored — smac89, Aug 13 '19 at 21:41
The `Update >= 8u60` solution worked for me, but be careful of having any spaces in your font path. All my Java projects are located in a folder called `Java Projects` so no matter what I did there would always be a space. I had to create another folder without a space, put my project in there, and now the font loads perfectly fine. — Austin Whitelaw, Feb 08 '23 at 16:23

score 2 · Answer 2 · answered Oct 26 '15 at 08:14

Here is a little example showing how to load and set a custom font.

package createfont;

import java.io.IOException;
import java.io.InputStream;

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.BorderPane;
import javafx.scene.text.Font;
import javafx.stage.Stage;

public class CustomFontTest extends Application {

    @Override
    public void start(Stage primaryStage) throws Exception {
        String currentFontFile = "English Gothic, 17th c..TTF";
        InputStream fontStream = CustomFontTest.class.getResourceAsStream(currentFontFile);
        if (fontStream != null) {
            Font bgFont = Font.loadFont(fontStream, 36);
            fontStream.close();

            final Button button = new Button("Press me");
            button.setFont(bgFont);

            BorderPane root = new BorderPane();
            root.setCenter(button);

            Scene scene = new Scene(root, 500, 100);

            primaryStage.setTitle("CustomFontTest");
            primaryStage.setScene(scene);
            primaryStage.show();
        } else {
            throw new IOException("Could not create font: " + currentFontFile);
        }
    }

    public static void main(String[] args) {
        launch(args);
    }

}

actually don't get "English Gothic, 17th c..TFF"? because it isn't a file path or a correct file name. — Viktoria, Oct 26 '15 at 08:45
Of course not. My assumption was that you would replace that with any of your own font files. — mipa, Oct 26 '15 at 10:04

score 0 · Answer 3 · answered Oct 26 '15 at 22:42

I tried this:

    public void setLabelStyle(Label label) {
    label.setStyle("-fx-font-family: Inconsolata:700; -fx-font-size: 25");
    Scene scene = new Scene(label);
    scene.getStylesheets().add("https://fonts.googleapis.com/css?family=Inconsolata:700");
    label.setTextFill(Color.GRAY);

in each method. Because I don't want write a new methode which overrides the start method just like above. (Actually thanks for this detailed answer, but it isn't what I am searching for). But also my solution doesn't work well...

You don't have to override a `start()` every time. You do it once in the class which extends Application. Stylesheet is normally added just once to your scene. — ItachiUchiha, Oct 27 '15 at 16:09

JavaFX custom Fonts

3 Answers3

Linked