指定字体大小时,Fontswesomefx图标将更改为矩形

时间:2016-03-17 19:01:21

标签: css javafx-8 font-awesome fxml

我在javafx项目中使用fontawesomefx。 我能够在应用程序中显示图标,但是当我更改字体大小时,图像显示为矩形。 我究竟做错了什么 ? 当我添加以下css时,字体会变为矩形。

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

这是主要的课程

package com.test.fontawesome.test;

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Scene;
import javafx.scene.layout.BorderPane;
import javafx.stage.Stage;

/**
 * Hello world!
 *
 */
public class App extends Application {
    public static void main(String[] args) {

        launch(args);
    }

    @Override
    public void start(Stage primaryStage) throws Exception {
        FXMLLoader loader = new FXMLLoader();
        loader.setLocation(getClass().getResource("FontTest.fxml"));
        // ToolBar toolBar = loader.load();
        BorderPane root = loader.load();
        // root.setTop(toolBar);
        Scene scene = new Scene(root);
        scene.getStylesheets().add("/styles/font_awesome.css");
        primaryStage.setTitle("Font Awesome with JavaFX");

        primaryStage.setScene(scene);
        primaryStage.show();
    }

}

FXML文件:

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

<?import javafx.scene.control.Button?>
<?import javafx.scene.control.ToolBar?>
<?import javafx.scene.layout.BorderPane?>
<?import de.jensd.fx.glyphs.fontawesome.FontAwesomeIconView?>
<?import de.jensd.fx.glyphs.fontawesome.FontAwesomeIcon?>
<?import de.jensd.fx.glyphs.materialdesignicons.MaterialDesignIconView?>

<BorderPane maxHeight="-Infinity" maxWidth="-Infinity"
    minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0"
    prefWidth="600.0" xmlns="http://javafx.com/javafx/8.0.65" xmlns:fx="http://javafx.com/fxml/1">
    <top>
        <ToolBar prefHeight="31.0" prefWidth="600.0"
            BorderPane.alignment="CENTER">
            <items>
                <Button>
                    <graphic>
                        <MaterialDesignIconView glyphName="WINDOW_MINIMIZE">
                        </MaterialDesignIconView>
                    </graphic>
                </Button>
                <Button>
                    <graphic>
                        <MaterialDesignIconView glyphName="APPLE">
                        </MaterialDesignIconView>
                    </graphic>
                </Button>
                <Button>
                    <graphic>
                        <MaterialDesignIconView glyphName="ARCHIVE">
                        </MaterialDesignIconView>
                    </graphic>
                </Button>
            </items>
        </ToolBar>
    </top>
</BorderPane>

0 个答案:

没有答案