使用JavaFX 8和css加载自定义字体

Question

问题

我为我的应用程序创建了一个超级马里奥主题css样式表，我想将我的按钮字体更改为名为Press Start 2P的自定义字体，这是NES Mario游戏中使用的像素化字体。但是，由于某些奇怪的原因，我的应用程序没有加载字体。

CSS代码：

.text
{
    -fx-font-family: "Press-Start-2P";
}

.button
{
    -fx-background-color: transparent;
    //-fx-text-fill: rgb(255, 255, 255);
}

@font-face
{
    font-family: Press-Start-2P;
    src: url("PressStart2P.ttf");
}

当我运行应用程序时，它会给我这样的信息：

  

2015年4月25日上午8:22:32 com.sun.javafx.css.StyleManager loadStylesheetUnPrivileged       信息：无法加载@ font-face字体[文件：/ C：/ Users / Ahmad％20El-Baher / Documents / Programming / Java / Integrative％20Project％20Semester％204 / trunk / build / classes / res / styles / PressStart2P .TTF]

如何让我的应用程序正确加载我的字体？

Answer 1

  

请注意，以下内容仅适用于 Java版本＆gt; = 1.8u60

我遇到了同样的问题。在CSS 8中加载JavaFX的方法是设置字体外观文件，然后使用字体名称作为参考，可以通过预览字体找到。

字体文件相对于CSS。我有根设置字体，但你可以删除它并保留每个节点。

  

CSS代码

@font-face {
    src: url("freeuniverse2.ttf"),
}

.root {
    -fx-background-color: gray;
    -fx-font-family: "Free Universe 2";
}

#window {
    -fx-border-image-source: url("images/windowfill.png");
    -fx-border-image-slice: 17 6 13 6 fill;
    -fx-border-image-width: 17 6 13 6 ;
    -fx-background-color: gray;
}

.text {
    -fx-text-fill: white;
    -fx-font-size: 16px;
    -fx-font-family: "Free Universe 2";
    -fx-background-color: transparent;
}

.pane {
    -fx-border-image-source: url("images/windowfill.png");
    -fx-border-image-slice: 17 6 13 6 fill;
    -fx-border-image-width: 17 6 13 6 ;
    -fx-background-color: gray;
}

.vbox {
        -fx-border-image-source: url("images/windowfill.png");
    -fx-border-image-slice: 17 6 13 6 fill;
    -fx-border-image-width: 17 6 13 6 ;
    -fx-background-color: gray;
}

#title-text {
    -fx-text-fill: white;
    -fx-font-size: 36px;
    -fx-font-family: "Free Universe 2";
}

.label {
    -fx-text-fill: white;
    -fx-font-size: 16px;
    -fx-font-family: "Free Universe 2";
    -fx-background-color: transparent;
}

  

字体文件预览（下面你可以看到真正的字体名称）

Answer 2

我能够添加Google字体。
例如，

/* TOP OF THE FILE */
@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
@import url('https://fonts.googleapis.com/css2?
family=Ranchers&display=swap');

.my-robot-label{
    -fx-font-family: 'Roboto';
}

.my-rancher-label{
    -fx-font-family: 'Ranchers';
}

注意：这是我成功添加外部字体的唯一方法

PS：但是打包后仍然无法使用！

Answer 3

查看您的CSS文件和TTF文件是否在同一目录中。根据您的代码src: url("PressStart2P.ttf");，它们应位于同一目录中。

另外，请尝试替换

@font-face
{
    font-family: Press-Start-2P;
    src: url("PressStart2P.ttf");
}

与

@font-face
{
    -fx-font-family: 'Press-Start-2P';
    src: url('PressStart2P.ttf');
}

Answer 4

我知道它有点晚了。但对于那些仍然需要帮助的人，我认为这里的问题是你的项目名称中有空格。尝试使用IntegrativeProjectSemester4重命名项目