如何在JavaFX中将Fo​​ntAwesome升级到版本5 [英] How to upgrade FontAwesome to version 5 in JavaFX

问题描述

我有一个使用FontAwesome图标的JavaFX，我想使用新版本5. 但似乎不再起作用.

I have a JavaFX using FontAwesome icons and I wanted to use the new version 5. But it seems it doesn't work anymore.

这是一个用Groovy编写的简单演示应用程序，可与旧版FontAwesome版本一起使用:

Here's a simple demo app written in Groovy that works with the older FontAwesome version:

import javafx.application.Application
import javafx.scene.Scene
import javafx.scene.control.Label
import javafx.scene.layout.VBox
import javafx.scene.text.Font
import javafx.stage.Stage

class App extends Application {
    static final String PENCIL = "\uf040"

    @Override
    void start(Stage primaryStage) throws Exception {
        def root = new VBox(10)
        root.children.with {
            add new Label('My icon')
            add new Label(PENCIL).with {
                it.style = '-fx-font-family: FontAwesome;' +
                        '-fx-font-size: 24px;' +
                        '-fx-text-fill: red'
                it
            }
        }
        def scene = new Scene(root, 600, 600)
        primaryStage.with {
            it.scene = scene
            it.title = "FontAwesome Demo"
            centerOnScreen()
            show()
        }
    }

    static void main(String[] args) {
        Font.loadFont( App.getResource(
                // "/fa-regular-400.ttf" /* version 5 */
                "/fontawesome-webfont.ttf" /* old version (not sure which) */
        ).toExternalForm(), 12 )
        launch(App, args)
    }
}

使用旧字体文件，它可以工作:

Using the old font file, it works:

升级后:

升级到版本5 除了将字体家族从FontAwesome更改为Font Awesome 5 Free之外，似乎只字未提，但更改不会解决此问题.

The docs on upgrading to version 5 doesn't seem to mention anything much other than the font-family changed from FontAwesome to Font Awesome 5 Free, but changing that won't fix the problem.

注意:我的实际应用程序是用Java编写的，这里仅以Groovy为例，问题仍然相同.

NOTE: My actual app is written in Java, just using Groovy here as an example, the problem is the same though.

推荐答案

我终于可以使用它了.除了更改字体系列之外，您还必须为JavaFX使用正确的字体文件，因为它们分发的大多数选项似乎都不起作用...

I've finally got it working. Besides changing the font-family, you must use the correct font file for JavaFX, as most of the options they distribute don't seem to work...

此外，他们还更改了图标的名称(很好，对吗?)

Also, they've changed the names of the icons (nice, right?) as shown in the upgrading docs, so you must update them one by one.

在Web发行版中，只有名为xx-solid-900.xx的字体文件有效. woff和tiff扩展名都可以使用，但woff2无效.

From the web distribution, only the font files called xx-solid-900.xx work. The woff and tiff extensions both seem to work, but woff2 doesn't.

我还尝试了桌面发行版，该发行版具有更大的文件，只有Font Awesome 5 Free-Solid-900.otf可用.

I also tried the desktop distribution, which has much larger files, and only Font Awesome 5 Free-Solid-900.otf worked.

这是我在上述应用程序中显示的版本5中找到的钢笔图标(unicode f303):

Here's the pen icon (unicode f303) I found in version 5 displayed in the above app:

更犀利！

作为参考，最终的源代码:

For reference, the final source code:

import javafx.application.Application
import javafx.scene.Scene
import javafx.scene.control.Label
import javafx.scene.layout.VBox
import javafx.scene.text.Font
import javafx.stage.Stage

class App extends Application {
    static final String PENCIL = "\uf303"

    @Override
    void start(Stage primaryStage) throws Exception {
        def root = new VBox(10)
        root.children.with {
            add new Label('My icon')
            add new Label(PENCIL).with {
                it.style = '-fx-font-family: "Font Awesome 5 Free";' +
                        '-fx-font-size: 24px;' +
                        '-fx-text-fill: red'
                it
            }
        }
        def scene = new Scene(root, 100, 140)
        primaryStage.with {
            it.scene = scene
            it.title = "FontAwesome Demo"
            centerOnScreen()
            show()
        }
    }

    static void main(String[] args) {
        Font.loadFont(App.getResource("/fa-solid-900.woff").toExternalForm(), 12)
        launch(App, args)
    }
}

这篇关于如何在JavaFX中将Fo​​ntAwesome升级到版本5的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！