如何在fxml项目中使用字体awesome(javafx)

问题描述 投票:13回答:6

我想在我的项目中使用字体字体真棒,但我不知道如何在我的项目中使用字体真棒。

我找到了一些例子,但它们不能在fxml中使用。

font awesome javafx

我需要帮助如何使用fxml在我的项目中使用它

谢谢。

java javafx javafx-2 javafx-8 fxml
6个回答
7
投票

我认为这是你需要ControlFX,包括字体真棒支持。请参阅javadoc获取更多信息(但我有一天测试它并且工作正常)


11
投票

我通过改编Jens Deters's approach实现了使用FA图标。

他的惯用目标是反对fxml声明方式的动态组合。尽管如此,his AwesomeIcon enumeration(使用unicode字符映射FA可理解的名称)非常适合我的意图。

它应该首先在main / app类中静态加载字体:

public class App extends Application {
    static {
        Font.loadFont(App.class.getResource("/font/fontawesome-webfont.ttf").toExternalForm(), 10);
    }

    @Override
    public void start(final Stage primaryStage) throws Exception {
        URL resource = getClass().getResource("/fxml/app.fxml");
        primaryStage.setScene(new Scene((Parent) FXMLLoader.load(resource), 500, 500));
        primaryStage.setTitle("FontAwesomeFX demo");
        primaryStage.show();
    }

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

不能在fxml中使用unicode字符(根据需要指定FA图标),但可以使用这些值动态设置属性。因此,有了上面提到的枚举(AwesomeIcon),工作完成了:

  1. 进口: <?import de.jensd.fx.fontawesome.AwesomeIcon?>
  2. 节点: <Label styleClass="awesome" style="-fx-font-family: FontAwesome; -fx-font-size: 16.0;"> <text><AwesomeIcon fx:constant="FILE"/></text> </Label>

我最终实现了一个Icon Widget / Control / Component,用于恢复具有两个属性的代码量:

  1. 值:FA图标名称;
  2. size:标签上样式-fx-font-size的样式属性。

新代码(效果相同):

<Icon value="FILE" size="16"/>

可以找到该控件的代码here。您还可以找到一个工作示例,因为它包含字体和测试代码。


6
投票

我将由Mike Penz开发的Android-Iconics库移植到FX。更新将很快跟进(文档,以及)..

showcase.jar将为您提供图标的概述。

用法(需要Java 1.8):

FxIconicsLabel labelTextDefault =
                (FxIconicsLabel) new FxIconicsLabel.Builder(FxFontGoogleMaterial.Icons.gmd_folder_special)
                        .size(24)
                        .text("Right (default)")
                        .color(MaterialColor.ORANGE_500)
                        .build();

(或参见DialogPlayGround.java)

FxIconics on GitHub

enter image description here enter image description here


3
投票

如果你使用SceneBuilder试试这个。

  • 首先,下载'fontawesomefx'
  • 其次,使用SceneBuilder的Jar / FXML Manager将jar导入SceneBuilder
  • 三,图书馆搜索FontAwesomeIconViewGlyphCheckBoxMaterialDesignIconViewMaterialIconViewWeatherIconView

样本FXML:

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

<?import de.jensd.fx.glyphs.control.GlyphCheckBox?>
<?import de.jensd.fx.glyphs.fontawesome.FontAwesomeIconView?>
<?import de.jensd.fx.glyphs.materialdesignicons.MaterialDesignIconView?>
<?import de.jensd.fx.glyphs.materialicons.MaterialIconView?>
<?import de.jensd.fx.glyphs.weathericons.WeatherIconView?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.layout.StackPane?>
<?import javafx.scene.layout.VBox?>


<StackPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="400.0" prefWidth="600.0" xmlns="http://javafx.com/javafx/8.0.141" xmlns:fx="http://javafx.com/fxml/1">
   <children>
      <VBox maxHeight="-Infinity" maxWidth="-Infinity">
         <children>
            <Label text="FontAwesomeIconView">
               <graphic>
                  <FontAwesomeIconView />
               </graphic>
            </Label>
            <Label text="GlyphCheckBox">
               <graphic>
                  <GlyphCheckBox />
               </graphic>
            </Label>
            <Label text="MaterialDesignIconView">
               <graphic>
                  <MaterialDesignIconView />
               </graphic>
            </Label>
            <Label text="MaterialIconView">
               <graphic>
                  <MaterialIconView />
               </graphic>
            </Label>
            <Label text="WeatherIconView">
               <graphic>
                  <WeatherIconView />
               </graphic>
            </Label>
         </children>
      </VBox>
   </children>
</StackPane>

enter image description here

不要忘记将这些罐子添加到项目的类路径中!


1
投票

正如@Sedrick所说,您可以使用fontawesomefx库并在FXML中使用它,如下所示:

注意:JavaFX 8和FontAwesomeFx v8.9

dashboard.fxml

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

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

<AnchorPane xmlns="http://javafx.com/javafx/8.0.121" 
    xmlns:fx="http://javafx.com/fxml/1"
    fx:controller="com.example.DashboardController" 
    prefHeight="760" prefWidth="1080">

    <Button text="Close" AnchorPane.topAnchor="0" AnchorPane.leftAnchor="0">
        <graphic>
            <FontAwesomeIconView glyphName="CLOSE" glyphSize="24"/>
        </graphic>
    </Button>

</AnchorPane>

在场景构建器中如下所示:screenshot of iconised button


0
投票

您可以在Scene Builder中使用.jar文件来使用fontawesomefx库,您可以使用Fontawesome-fx Glyph browser浏览所有可用的图标

© www.soinside.com 2019 - 2024. All rights reserved.