JavaFX使用外部字体文件

发表于 | 分类于
本文字数: 662 | 阅读时长 ≈ 3 分钟

引入外部字体需要注意一点，有些字体只支持英文，因此可能会出现即使设置了字体，但是看不到效果的情况。

本文字体以思源黑体为例，下载地址：https://fonts.google.com/download?family=Noto%20Sans%20SC

默认字体

先看下默认字体效果：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
public class ImportFontDemo extends Application {
    @Override
    public void start(Stage stage) {

        VBox root = new VBox();
        root.setAlignment(Pos.CENTER);

        Label text = new Label();
        text.setText("这是一段文字");
        text.setFont(Font.font(36));

        root.getChildren().add(text);

        Scene scene = new Scene(root, 400, 200);
        scene.getStylesheets().add(this.getClass().getResource("/css/style.css").toExternalForm());
        stage.setScene(scene);
        stage.setTitle("Font Demo");
        scene.setRoot(root);
        stage.show();
    }

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

运行效果：

210506-01

加载本地字体

以 Maven 项目为例，下载字体解压后放到resources/font 文件夹内：

1
2
3
4
5
6
7
8
- src
  - main
    - java
    - resource
      - css
      - font
        - NotoSansSC-Black.otf
  - test

应用初始化时加载

1
2
3
4
5
6
7
8
@Override
public void init() throws Exception {
  super.init();
  // 加载本地字体文件，每个字体文件只需加载一次
  Font font = Font.loadFont(this.getClass().getResource("/font/NotoSansSC-Black.otf").toString(), 18);
  // 输出字体信息，后续使用字体时需要用到字体名称
  System.out.println(font); // Font[name=Noto Sans SC Black, family=Noto Sans SC Black, style=Regular, size=18.0]
}

如果出现字体加载出错，请检查字体文件路径是否正确：

1
2
3
4
5
6
7
8
9
10
11
12
13
<!-- pom.xml 打包静态文件 -->
<build>
  <resources>
    <resource>
      <directory>src/main/resources</directory>
      <includes>
        <include>css/*</include>
        <include>font/*</include> <!-- 加载指定路径下的字体文件 -->
      </includes>
      <filtering>false</filtering>
    </resource>
  </resources>
</build>

设置标签字体：

1
2
3
Label text = new Label();
text.setText("这是一段文字");
text.setFont(Font.font("Noto Sans SC Black", 36)); // 使用字体

CSS文件中加载

在 CSS文件中使用：

1
2
3
4
5
6
7
@font-face {
    src: url("/font/NotoSansSC-Black.otf");
}
.label {
    -fx-font-family: 'Noto Sans SC Black';
    -fx-font-size: 36;
}

注意：这种方式引入的字体只能在CSS文件中使用

运行效果

加载在线字体

应用初始化时加载

1
2
3
4
5
6
7
@Override
public void init() throws Exception {
  super.init();
  // 加载在线字体，每个字体文件只需加载一次
  Font font = Font.loadFont("https://image.iyichen.xyz/NotoSansSC-Thin.otf", 18);
  System.out.println(font);
}

设置标签字体：

1
2
3
Label text = new Label();
text.setText("这是一段文字");
text.setFont(Font.font("Noto Sans SC Thin", 36));

引入CSS文件时加载

1
2
3
// 加载在线字体
scene.getStylesheets().add("https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@100&display=swap");
scene.getStylesheets().add(this.getClass().getResource("/css/style.css").toExternalForm());

或者：

1
2
3
@font-face {
    src: url("https://image.iyichen.xyz/NotoSansSC-Thin.otf");
}

注意：以上两种方式引入的字体只能在CSS文件中使用

运行效果

210506-03