JavaFX 12快速指南
本文于1813天之前发表,文中内容可能已经过时。
介绍
JavaFX允许您使用高度可移植的现代硬件加速用户界面创建Java应用程序。
本教程将帮助您编写JavaFX 12应用程序并在桌面平台上运行它。
有关如何在移动平台上运行JavaFX应用程序的信息,请参阅 Gluon Mobile入门。
有关JavaFX 11的长期支持(LTS)的信息,请参阅 JavaFX长期支持选项。
JavaFX的12建立在JDK的顶部12,并且是独立的组件。开发JavaFX应用程序有两种不同的选择:
- 使用JavaFX SDK
- 使用构建系统(例如maven / gradle)从Maven Central下载所需的模块。
对于这两个选项,需要最新版本的JDK 12,或至少JDK 11。
安装Java 12
为您的操作系统下载适当的JDK。我们将在本教程中使用 OpenJDK。
安装后,您可以使用 java命令行中的命令。
检查是否安装了正确的java版本:
1 | $ java -version |
您需要将JAVA_HOME环境变量设置为JDK 12安装目录。您可以按照 本指南为您的平台设置JAVA_HOME。
安装JavaFX SDK 12
为您的操作系统 下载适当的 JavaFX运行时,并将其解压缩到所需的位置。
使用Maven开发
如果要使用Maven开发JavaFX应用程序,则无需下载JavaFX SDK。只需指定所需的模块和版本pom.xml,构建系统将下载所需的模块,包括适用于您平台的本机库。
这是一个pom.xml 文件,显示了如何实现这一点,包含在此示例中。
pom使用JavaFX Maven插件:
1 | <plugins> |
运行应用程序(例如,基于 引用样本中的HelloFX.java):
1 | mvn clean javafx:run |
使用Gradle开发
与Maven类似,我们可以在build.gradle文件中声明所需的JavaFX模块。但是,对于Gradle,我们需要应用JavaFX gradle插件:
1 | plugins { |
接下来,我们添加所需的模块。例如,如果我们只需要javafx.controls 模块,我们将包括:
1 | javafx { |
您可以指定不同版本的JavaFX。例如,如果您想坚持使用JavaFX 11.0.2:
1 | javafx { |
这是一个build.gradle 文件,它显示了如何实现这一点,取自此示例。
使用以下命令运行应用程序(例如,使用 给定样本中的HelloFX.java):
1 | gradlew run |
JavaFX 12和IntelliJ
本节介绍如何使用IntelliJ中的Java 12和JavaFX 12。
为您的操作系统 下载适当的JDK 12。确保JAVA_HOME已正确设置为Java 12安装目录。
安装GLuon公司的 JavaFX Scene Builder,安装完后指定Scene Builder的可执行文件的路径,在IntelliJ中打开File -> Settings -> Languages & Frameworks -> JavaFX,设置可执行文件路径。
您可以创建JavaFX 12模块化或非模块化项目,并使用IDE工具,Maven或Gradle构建工具。
1. 创建Java项目
新建一个Java项目,然后编写如下的类,然后编译运行,即可看到结果。关于这个程序不用做解释吧。如果有学习过Swing以及其他图形界面框架的经验的话,应该非常容易理解这段代码。当然由于JavaFX是新东西,所以也顺便使用Java 8的新特性——lambda表达式。
你也可以选择创建JavaFX项目,这里为了让初学者更深入体会,选择普通Java项目,采取手工创建。
2. 设置JDK 12
转到File -> Project Structure -> Project,并将项目SDK设置为12。您还可以将语言级别设置为12。
3. 创建一个库
转到File -> Project Structure -> Libraries,JavaFX 12 SDK 并将其作为库添加到项目中。指向libJavaFX SDK 的文件夹。
4. 创建一个类
HelloJavaFX类代码
1 | package myh.javafxsample; |
5. 添加VM选项
要解决此问题,请单击Run -> Edit Configurations…并添加以下VM选项:
1 | --module-path "c:\javafx-sdk-12.0.1\lib" --add-modules javafx.controls,javafx.fxml |
请注意,IntelliJ创建的默认项目使用FXML,因此javafx.fxml 需要使用FXML javafx.controls。如果您的项目使用其他模块,则还需要添加它们。
您可以定义可在将来项目中使用的全局变量。转到 Preferences (File -> Settings) -> Appearance & Behavior -> Path Variables,并将变量名称定义为PATH_TO_FX,并浏览到JavaFX SDK的lib文件夹以设置其值,然后单击“应用”。
然后,在将VM选项设置为以下时,可以引用此全局变量:
1 | --module-path ${PATH_TO_FX} --add-modules javafx.controls,javafx.fxml |
请注意,更多参数参考Java 9 打破模块的封装,可以解决类似cannot access class com.sun.javafx.scene.layout.RegionHelper (in module javafx.graphics) because module javafx.graphics does not export com.sun.javafx.scene.layout to unnamed module错误。
6. 运行项目
单击Run -> Run…以运行该项目,现在它应该可以正常工作。
用FXML设计用户界面
现代图形界面框架都支持将界面和代码分离开,而且比较常用的描述语言是XML,例如QT的QML、WPF的XAML,当然JavaFX也有类似的语言,叫做FXML。如果需要详细了解FXML,可以参考Oracle官网的文章Introduction to FXML。
下面用FXML重写一下上面那个小例子,每个部分都做了注释。如果学习过其他类似描述语言的话,会发现这些其实都差不多。唯一需要注意的就是布局里面的fx:controller
属性,它指定一个控制器,控制器的作用就是编写界面对应的代码。 可以通过JavaFX Scene Builder设计工具设计。
1. 布局文件fxml
新建Stylesheet文件myh.javafxsample.sample.fxml的代码
1 |
|
- sample.fxml中的 GridPane fx:controller=”myh.javafxsample.Controller” 随着FXML文件对应的控制器的名称变化。
- sample.fxml: fxml源文件,引用样式表和Controller、定义JavaFX组件等,即跟用户界面相关的定义都在这里。
- 选中“#showPasswordButton”,按下Alt+回车,快速在Controller中生成对应的属性和方法,单击左边的<>图标,可以快速跳到sample.fxml。
2. FXML文件控制器
下面就是这个FXML文件对应的控制器,它是一个标准的Java类。在FXML中用fx:id
属性指定的ID,可以在控制器中声明为一个类字段,通过这个字段就可以和界面组件进行交互。同样道理,onAction
声明的事件处理程序,在控制器中就是一个方法。注意这些字段和方法都需要使用@FXML
注解进行标注。
myh.javafxsample.Controller.java的代码
1 | package myh.javafxsample; |
- Controller.java: 定义sample.fxml中的组件id并实现sample.fxml中事件引发的方法,主要用于键盘、鼠标事件的处理。
3. 主程序
最后要做修改的就是主程序了。在主程序中需要使用FXMLLoader
来加载FXML资源,其他部分没有太大变化。
myh.javafxsample.UseFxml.java的代码
1 | package myh.javafxsample; |
- UseFxml.java:包括一个start()方法和main()方法,start()方法是所有JavaFX应用程序的入口,是必需的;而当JavaFX应用程序是通过JavaFX Packager工具打包时,main()方法就不是必需的的了,因为JavaFX Package工具会将JavaFX Launcher嵌入到JAR文件中。该文件使用FXMLLoader类,该类负责加载FXML源文件sample.fxml并返回结果对象图,继承了javafx.application.Application,通过stage和scene来定义UI容器,其中Stage是最顶层的javafx容器,Scene则是所有组件的容器。
这样程序完成,可以运行查看结果。
4. 组件样式CSS
如果希望修改组件样式,JavaFX提供了CSS接口,让我们可以直接使用CSS文件修改样式。首先需要在FXML文件中添加相应样式表的引用。文件名前面的@
表示这个CSS文件和FXML文件在同一目录下。
修改myh.javafxsample.sample.fxml代码,增加stylesheets属性。
1 | #方法1 |
- 在sample.fxml中的GridPane中添加stylesheet属性,并命名,然后选中样式表名,按下Alt+回车,可快速生成一个样式表文件。
样式表和普通的样式表差不多,只不过需要添加JavaFX特有的前缀-fx-
。
创建myh.javafxsample.style.css的代码
1 | #btnShowPassword { |
- 在样式表中添加样式:单击左边的小方框可以调出色板,选择不同的颜色。
上面用了ID选择器,所以对应地,在FXML中也需要ID属性。
修改myh.javafxsample.sample.fxml代码
1 | <Button id="btnShowPassword" text="显示密码" |
这里只简单修改了一下按钮的背景色,其实可以更改的样式有很多,包括程序背景等等。
然后运行程序查看结果。
Maven项目(IntelliJ)
按照以下步骤创建JavaFX非模块化项目,并使用Maven工具构建并运行它。或者,您可以从此处下载类似的项目。
1. 创建一个Maven项目
选择File -> New -> Project -> Maven并启用Create from archetype。如果尚未安装JavaFX 原型,请选择Add archetype…并设置groupId(org.openjfx),artifactId(javafx-maven-archetypes)和version(0.0.1),然后按OK。
安装后,选择javafx-maven-archetypes工件。
像org.openjfxartifactId一样提供groupId hellofx。
选择原型的artifactId之间,javafx-archetype-fxml或javafx-archetype-simple根据您的项目中使用FXML与否。
您也可以为其创建属性javafx-version,并将其设置为12.0.1。
最后,为项目提供名称,例如项目HelloFX的位置。
2. 验证项目
1)对于非模块化项目,您可以删除该module-info.java文件。您可以在此处找到生成的pom文件。
2)对于模块化项目,打开module-info类,包括所需的模块javafx.controls和javafx.fxml。由于FXML使用反射来访问模块中的控制器,因此它已被打开javafx.fxml。您可以在此处找到生成的pom文件。
pom文件
1
2
3
4
5<configuration>
<!-- 模块化 -->
<release>12</release>
<jlinkImageName>hellofx</jlinkImageName>
<launcher>launcher</launcher>maven把xml、css配置文件打包进去,否则运行时抛找不到资源的异常。
编辑pom.xml添加下面代码1
2
3
4
5
6
7
8
9
10
11
12
13
14<build>
<resources>
<resource>
<!-- 这里是放在 src/main/java-->
<directory>src/main/java</directory>
<includes>
<include>**/*.css</include>
<include>**/*.fxml</include>
</includes>
<!-- 是否替换资源中的属性-->
<filtering>false</filtering>
</resource>
</resources>
......module-info类
1
2
3
4
5
6
7
8# 模块化
module hellofx {
requires javafx.controls;
requires javafx.fxml;
opens org.openjfx to javafx.fxml;
exports org.openjfx;
}
验证它包含javafx.controls和javafx.fxml依赖项,并包括javafx-maven-plugin。
导入Maven更改。JavaFX类将被识别。还要注意的是Maven的管理所需的依赖关系:它会增加javafx.base和javafx.graphics由需要javafx.controls和javafx.fxml,但最重要的,这将增加基于你的平台上所需要的分类,下载特定平台的罐子。
对于任何其他maven依赖项,可以在本地.m2存储库中找到这些jar 。
3. 运行项目
您可以打开Maven Projects窗口并单击HelloFX -> Plugins -> compiler -> compiler:compile以编译项目,然后单击HelloFX -> Plugins -> javafx -> javafx:run以执行项目。
注意: 如果JAVA_HOME未设置为12,则从Maven Projects窗口运行可能会失败。要避免它,您可以将正确的java命令添加到javafx-maven-plugin :
1 | <configuration><executable>${env.JAVA_HOME} java</executable></configuration> |
更多配置信息参考用于运行JavaFX 11+应用程序的Maven插件
该项目也可以从终端运行。确保JAVA_HOME设置为12,然后运行mvn clean javafx:run。
4. 创建自定义运行时映像
模块化项目,才能进行该步操作。
要创建自定义运行时,可以使用JavaFX Maven插件单击HelloFX -> Plugins -> javafx -> javafx:jlink,或者从JAVA_HOME设置为12的终端 运行:
1 | mvn clean javafx:jlink |
请注意,插件允许使用常用选项作为jlink命令,以及使用自定义图像创建启动器或zip。
构建映像后,可以从命令行运行它:
1 | target\hellofx\bin\launcher |
Gradle项目(IntelliJ)
按照以下步骤创建JavaFX非模块化项目,并使用Gradle工具构建并运行它。或者,您可以从此处下载类似的项目。
1. 创建Gradle项目
使用Java创建Gradle项目。
像org.openjfxartifactId一样提供groupId hellofx。根据项目JDK 12选择Gradle JVM 。然后为项目提供名称,例如项目HelloFX的位置。项目打开时,添加一个包org.openjfx和一个空MainApp类。
2. 修改构建
1)对于非模块化项目,编辑build.gradle文件并将其替换为此 构建文件,并mainClassName相应地设置 为org.openjfx.MainApp。
2)对于模块化项目,编辑build.gradle文件并将其替换为此 构建文件,并mainClassName相应地设置 为org.openjfx.MainApp。请注意org.openjfx.javafxplugin插件的使用,这消除了添加JavaFX依赖项和为它们设置编译和运行任务的模块路径的必要性。
与Maven类似,我们可以在build.gradle文件中声明所需的JavaFX模块。更多配置信息参考JavaFX 11+ controlsfx的build.gradle 。但是,对于Gradle,我们需要应用JavaFX gradle插件:
1 | javafx { |
同步项目,您将获得JavaFX依赖项。
对于任何其他Gradle依赖项,可以在本地.gradle存储库中找到这些jar 。
gradle把xml、css配置文件打包进去,否则运行时抛找不到资源的异常。
编辑build.gradle添加下面代码1
2
3
4
5
6
7//将src文件夹中的资源文件同时打包
processResources {
from('src/main/java') {
include '**/*.fxml'
include '**/*.css'
}
}$moduleName,module-info类中的module名称,如果module-info类会出错,可先改为常量。
3.添加module-info类
模块化项目,才能进行该步操作。
添加module-info类,包括所需的模块javafx.controls和javafx.fxml。由于FXML使用反射来访问模块中的控制器,因此必须将其打开javafx.fxml。最后,导出包org.openjfx。
4. 添加源代码
基于此MainApp类,将其内容添加到项目主类。然后添加控制器 和FXML以及css 文件。请注意,IDE可识别JavaFX类。
5. 运行项目
您可以通过View -> Tool Windows -> Gradle打开Gradle窗口,并单击hellofx -> Tasks -> build -> build以构建项目,然后单击hellofx -> Tasks -> application -> run以执行项目。
您也可以打开终端并运行:
1 | gradlew run |
6.创建自定义运行时映像
模块化项目,才能进行该步操作。
要创建自定义运行时,可以使用org.beryx.jlink插件。它可以很容易地与JavaFX Gradle插件结合使用:
1 | plugins { |
生成自定义图像。运行hellofx -> Tasks -> build -> jlink任务以创建映像。
要运行图像,请在终端上键入:
1 | build\image\bin\hellofx |
其他
maven下载依赖jar包慢
打开maven目录下conf文件夹的settings.xml文件,添加国内aliyun镜像加速。
1 | <settings xmlns="http://maven.apache.org/SETTINGS/1.0.0" |
新建项目下载Gradle慢的问题
打开用户主目录,windows平台c:\Users\用户名.gradle
找到./gradle/wrapper/dist/gradle-版本号-bin目录
去官方网站下载这个版本号对应的安装包http://services.gradle.org/distributions/
把下载下来的文件存放到这个目录下面的子目录 (目录名由字母和数字组成) 下面。
Gradle下载依赖jar包慢
单个项目配置
在项目中的build.gradle修改内容
1 | buildscript { |
全局配置
对所有项目生效,在USER_HOME/.gradle/下创建init.gradle文件
1 | allprojects{ |