如何在JavaFX中指定字体大小时将fontawesomefx图标更改为矩形？

Question

我正在使用fontawesomefx-8.9并且我已使用

将其字体大小设置为15px

.glyph-icon {
  -fx-font-size: 15px;
}

然后我创建了一些FontAwesomeIconViews并将它们嵌入到一些按钮（JavaFX）中。

我不得不面对的问题是将鼠标悬停在按钮上时将fontAwesome图标更改为矩形。

FXML文件在下面（FXMLDocument，fxml）

<?xml version="1.0" encoding="UTF-8"?>

<?import de.jensd.fx.glyphs.fontawesome.FontAwesomeIconView?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.layout.AnchorPane?>

<AnchorPane id="AnchorPane" prefHeight="200" prefWidth="320" stylesheets="@styles.css" xmlns:fx="http://javafx.com/fxml/1" xmlns="http://javafx.com/javafx/8.0.111" fx:controller="test_fontawesome.FXMLDocumentController">
    <children>
        <Button fx:id="button" contentDisplay="TOP" layoutX="44.0" layoutY="41.0" onAction="#handleButtonAction" text="Click Me!" AnchorPane.leftAnchor="10.0" AnchorPane.topAnchor="40.0">
         <graphic>
            <FontAwesomeIconView fill="BLUE" glyphName="CUT" />
         </graphic></Button>
        <Label fx:id="label" layoutX="126" layoutY="120" minHeight="16" minWidth="69" />
      <Button fx:id="button1" contentDisplay="TOP" layoutX="183.0" layoutY="41.0" onAction="#handleButtonAction" text="Click Me!" AnchorPane.rightAnchor="10.0" AnchorPane.topAnchor="40.0">
         <graphic>
            <FontAwesomeIconView fill="BLUE" glyphName="PLUS" />
         </graphic>
      </Button>
    </children>
</AnchorPane>

CSS是下面的文件（styles.css）

.root {
    -fx-font-size: 12px ;
}

只需在场景构建器上预览，就会出现问题！

如果您需要源代码，请从here获取。

Answer 1

我在某个时候有同样的问题..我记得在我的css文件中添加以下行修复了这个问题。

.glyph-icon{ -fx-font-family:"Material Design Icons"; }

看起来您正在使用FontAwesome图标，可以尝试使用相应的字体系列。

  .glyph-icon{ -fx-font-family:"FontAwesome"; }

Answer 2

您应该考虑切换到FontAwesomeFX的最新版本。 昨天我发布了8.14：http://www.jensd.de/wordpress/?p=2579 8.14附带修复这些调整大小的问题！

Answer 3

如果更改字体大小，则必须设置图标的字体系列。

.glyph-icon {
  -fx-font-size: 15px;
  -fx-font-family: "FontAwesome"; /* or Material Design Icons*/
}

这解决了我的问题！ ;）