JavaFx —— 创建项目与打包

一、IDEA 创建 JavaFX 项目

  使用 IDEA 新建项目，Generators 选择 JavaFx，此处选择 kotlin 作为开发语言，Maven 进行项目构建；点击 Next 进行下一步选择额外的一些依赖库，不需要勾选，直接点击 Finish 即可。

  项目创建成功之后，对应的文件结构如下，下面依次介绍下这些文件中的内容。

.
├── pom.xml
└── src
    └── main
        ├── kotlin
        │   ├── com
        │   │   └── jinyx
        │   │       └── javafxdemo
        │   │           ├── HelloApplication.kt
        │   │           └── HelloController.kt
        │   └── module-info.java
        └── resources
            └── com
                └── jinyx
                    └── javafxdemo
                        └── hello-view.fxml

pom.xml

  导入 javafx 依赖，jdk8 之后，javafx 从 jdk 中移除，因此在高版本的 java 中使用 javafx 需要导入相关依赖库。

<dependencies>
    <dependency>
        <groupId>org.openjfx</groupId>
        <artifactId>javafx-controls</artifactId>
        <version>19.0.2.1</version>
    </dependency>
    <dependency>
        <groupId>org.openjfx</groupId>
        <artifactId>javafx-fxml</artifactId>
        <version>19.0.2.1</version>
    </dependency>
</dependencies>

  build 插件，用于打包 javafx 项目；关于其配置参数可以查看javafx:jlink options说明。

<build>
    <plugins>
        <plugin>
            <groupId>org.openjfx</groupId>
            <artifactId>javafx-maven-plugin</artifactId>
            <version>0.0.8</version>
            <configuration>
                <mainClass>com.jinyx.javafxdemo/com.jinyx.javafxdemo.HelloApplication</mainClass>
                <launcher>appfx</launcher>
                <jlinkZipName>app</jlinkZipName>
                <jlinkImageName>app</jlinkImageName>
                <noManPages>true</noManPages>
                <stripDebug>true</stripDebug>
                <noHeaderFiles>true</noHeaderFiles>
                <compress>1</compress>
            </configuration>
        </plugin>
    </plugins>
</build>

HelloApplication.kt

  应用程序主入口，继承自 javafx.application.Application，并重写 start 方法显示主窗口；在 main 方法中需要调用 launch 方法启动应用。

import javafx.application.Application
import javafx.fxml.FXMLLoader
import javafx.scene.Parent
import javafx.scene.Scene
import javafx.stage.Stage

class HelloApplication : Application() {
    override fun start(stage: Stage) {
        val parent = FXMLLoader.load<Parent>(HelloApplication::class.java.getResource("hello-view.fxml"))
        val scene = Scene(parent, 320.0, 240.0)
        stage.title = "Hello!"
        stage.scene = scene
        stage.show()
    }
}

fun main(args: Array<String>) {
    Application.launch(HelloApplication::class.java, *args)
}

  注意 kotlin 需要调用 launch(Class<? extends Application> clazz, String... args) 方法，而调用 launch(String... args) 将会出现如下错误；java 代码正常。

Error: class com.jinyx.javafxdemo.HelloApplicationKt is not a subclass of javafx.application.Application

  重写的 start 方法中，通过 FXMLLoader 加载 fxml 页面，在通过 stage.show 完成主窗口的显示

hello-info.fxml

  页面布局如下，采用 xml 标签语言，格式和 Android 类似，不过对应组件的样式，需要配合使用 css；后续学习组件中再深入。

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

<?import javafx.geometry.Insets?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.layout.VBox?>

<?import javafx.scene.control.Button?>
<VBox alignment="CENTER" spacing="20.0" xmlns:fx="http://javafx.com/fxml"
      fx:controller="com.jinyx.javafxdemo.HelloController">
    <padding>
        <Insets bottom="20.0" left="20.0" right="20.0" top="20.0"/>
    </padding>

    <Label fx:id="welcomeText" style="-fx-font-family: 'PingFang SC'"/>
    <Button text="Hello!" style="-fx-font-family: 'PingFang SC'" onAction="#onHelloButtonClick"/>
</VBox>

  fx:controller="com.jinyx.javafxdemo.HelloController" 指定需要绑定的 Controller，可以在控制器里面处理业务逻辑

HelloController.kt

  使用 @FXML 注解将组件和点击事件与 fxml 之间进行绑定，从而获取到 Label 组件以及提供 Button 点击事件

package com.jinyx.javafxdemo

import javafx.fxml.FXML
import javafx.scene.control.Label

class HelloController {
    @FXML
    private lateinit var welcomeText: Label

    @FXML
    private fun onHelloButtonClick() {
        welcomeText.text = "Welcome to JavaFX Application!"
    }
}

module-info.java

module com.jinyx.javafxdemo {
    requires javafx.controls;
    requires javafx.fxml;
    requires kotlin.stdlib;


    opens com.jinyx.javafxdemo to javafx.fxml;
    exports com.jinyx.javafxdemo;
}

  使用关键字 module，其属于 java9 的新特性；模块名的命名规则同包名，如下的 com.jinyx.javafxdemo;生命的模块主题可以为空，也可以包含如下指令:

• exports: 声明指定的包可以被其他模块访问，也可以增加 to 指定其他模块访问
• requires: 指定需要依赖的模块，例如上面指定需要的 javafx.controls、javafx.fxml、kotlin.stdlib
• provides
• uses
• opens: 对比 exports，允许在运行时可以使用反射访问；而 exports 编译期、运行期都只能访问 public 成员，但是使用 opens 需要 exports 配合使用，否则引用模块在编译期找不到该包

二、运行程序

  打开右侧 Maven 面板，双击 Pugins —> javafx —> javafx:run 或者命令行运行 mvn javafx:run 即可启动程序；
  如果出现如左边的乱码问题，可以在 fxml 中为组件指定字体，例如上面 fxml 代码中的 style="-fx-font-family: 'PingFang SC'"。

三、打包应用

  打开右侧 Maven 面板，双击 Pugins —> javafx —> javafx:jlink 或者命令行运行 mvn javafx:jlink；打包成功之后，将会在 target/app/bin 目录下生成可执行程序 appfx; 此处的 app 和 appfx 的名称，分别对应在 pom.xml 中，javafx-maven-plugin 插件定义的 jlinkImageName 和 launcher。

  但是此时打包生成的 appfx 可执行程序，运行时会打开一个终端窗口，因此需要进一步将其打包成对应平台的安装包或应用程序，例如 Windows 平台的 exe 程序、macOS 平台的 dmg 安装包；此处使用 jdk14 之后自带的 jpackage 进行打包，打包指令如下：

jpackage --name appName --module com.jinyx/com.jinyx.DesktopAppKt --runtime-image ./target/app/ --icon /Users/jinyx/img_logo.icns --type app-image

• --name: 打包的应用程序名
• --module: 对应 javafx-maven-plugin 中配置的 mainClass
• --runtime-image: jlink 打出的包
• --icon: 指定应用图标，macOS 测试需要 icns 类型图标；png 转 icns
• --type: 指定打包类型；例如我当前系统可选的值有 {"app-image", "dmg", "pkg"}

  上面的参数以及其他参数说明都可以通过 jpackage -h 进行查看