ImageView 和自定义字体无法正确加载到应用程序中

Question

我的 FXML 文件中的 SceneBuilder 中有一个 ImageView，我已经加载到文件中，它显示在 SceneBuilder 中，但它在我的应用程序中不起作用。我的文件结构如下：mainFolder/src/froggerClasses/ 和 mainFolder/resources/ 其中资源是图片所在的位置，我的 FXML 文件在 mainFolder/resources/fxml/

我为他们准备的 FXML 文件是：

<Pane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="800.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/11.0.1" xmlns:fx="http://javafx.com/fxml/1" fx:controller="froggerClasses.ScorePageController">
   <children>
      <ImageView fitHeight="800.0" fitWidth="600.0" pickOnBounds="true" preserveRatio="true">
         <image>
            <Image url="@../highScoresMenu.png" />
         </image>
      </ImageView>
      <TextArea fx:id="scoreTextArea" editable="false" layoutX="228.0" layoutY="253.0" prefHeight="411.0" prefWidth="122.0" stylesheets="@../css/buttonStyles.css" />
      <Button fx:id="mainMenuButton" layoutX="221.0" layoutY="680.0" mnemonicParsing="false" onAction="#goBackToMainMenu" prefHeight="66.0" prefWidth="136.0" stylesheets="@../css/buttonStyles.css" text="Main Menu" />
   </children>
</Pane>

我之前通过使用绝对路径设法解决了这个问题，但我不想要绝对路径，因为它有点硬编码。

我在文件夹mainFolder/resources/fonts 中也有一个字体，我尝试在我的 CSS 中使用它作为按钮，但它没有设置。我试过在我的 CSS 中这样做：

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

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

以及在我的一个扩展应用程序的类中，但它仍然不起作用。

@Override
    public void start(Stage primaryStage) throws IOException 
    {
        Font.loadFont(getClass().getResourceAsStream("fonts/PressStart2P.ttf"), 16);
        Parent root = FXMLLoader.load(getClass().getResource("/fxml/startMenu.fxml"));
        primaryStage.setScene(new Scene(root));
        primaryStage.setTitle("Frogger: The Game");
        primaryStage.show();
    }

我在这里查看了关于这两个问题的类似主题，并从他们两个那里得到了想法并尝试将它们应用到这里，但它仍然不起作用，我不知道为什么。可能是什么问题？

感谢任何帮助，谢谢。

Answer 1

对于加载自定义字体（不安装它们）这对我有用：

javafx.scene.text.Font.loadFont(getClass().getResource("/fonts/My-Custom-Font.ttf").toExternalForm(), 16f);  

我建议您在 Main 类中加载字体，以便它们在应用启动时可用，fonts 文件夹位于 resources（默认路径）中。
你可以使用 fxml 或 css 中的字体，就像任何其他字体一样：

-fx-font-family: "My Custom Font";

为ImageView设置图片，你可以给ImageView设置一个id，然后使用css设置图片，像这样：

#logo {
    -fx-image: url("../images/logo.png");
}

images 文件夹位于 resources 中的位置。由于（我的）fxml 文件位于 resources/fxml 中，我必须返回一个目录（ ../ ）而不是选择我的图像所在的文件夹（ images ）而不是选择我的图像文件（ logo.png ）。

我建议您阅读一些使用文件夹/文件的文章/文档。