使用Maven构建JavaFX程序（HelloWorld示例）

向右看齐 2022-06-14 07:55 1072阅读 0赞

如何使用Maven构建JavaFX程序呢？下面给出一个简单的示例！

本工程包含一个main入口函数类，一个controller类，资源文件包括一个fxml文件，一个css样式文件。  
工程目录如下：  
![工程目录树][SouthEast]

1.  利用命令行或者IDE创建一个Maven工程；
2.  在源码目录下新建包，新建一个MainApp类。MainApp类继承Application类，是程序的入口函数。
3.  在源码目录下新建resources文件夹，然后在该文件夹下面新建Main.fxml文件和application.css文件。FXML文件用于描述界面布局，CSS文件用于设置UI样式。
4.  修改maven工程的pom.xml文件，如下：

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
        <modelVersion>4.0.0</modelVersion>
    
        <groupId>cn.tzy</groupId>
        <artifactId>fxdemo</artifactId>
        <version>1.0-SNAPSHOT</version>
        <packaging>jar</packaging>
    
        <name>JavaFXDemo</name>
        <url>http://maven.apache.org</url>
    
        <properties>
            <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
            <maven.compiler.source>1.8</maven.compiler.source>
            <maven.compiler.target>1.8</maven.compiler.target>
            <maven.compiler.compilerVersion>1.8</maven.compiler.compilerVersion>
        </properties>
    
        <build>
            <finalName>HelloJavaFX</finalName>
            <plugins>
                <plugin>
                    <groupId>org.apache.maven.plugins</groupId>
                    <artifactId>maven-compiler-plugin</artifactId>
                    <version>3.6.1</version>
                    <configuration>
                        <source>${maven.compiler.source}</source>
                        <target>${maven.compiler.target}</target>
                    </configuration>
                </plugin>
                <plugin>
                    <groupId>org.apache.maven.plugins</groupId>
                    <artifactId>maven-jar-plugin</artifactId>
                    <version>3.0.2</version>
                    <configuration>
                        <outputDirectory>${project.build.directory}</outputDirectory>
                        <archive>
                            <manifest>
                                <addClasspath>true</addClasspath>
                                <classpathPrefix>libs/</classpathPrefix>
                                <mainClass>cn.tzy.MainApp</mainClass>
                            </manifest>
                        </archive>
                    </configuration>
                </plugin>
            </plugins>
        </build>
    
        <dependencies>
            <dependency>
                <groupId>junit</groupId>
                <artifactId>junit</artifactId>
                <version>4.12</version>
                <scope>test</scope>
            </dependency>
        </dependencies>
    </project>

其中，我们用到了两个编译插件：maven-compiler-plugin可以用来设置编译时JDK的版本号；maven-jar-plugin用来设置打包时的依赖包的存放位置以及程序的入口函数。

下面我们来进行编码：

### MainApp.java ###

package cn.tzy;
    
    import javafx.application.Application;
    import javafx.fxml.FXMLLoader;
    import javafx.scene.Parent;
    import javafx.scene.Scene;
    import javafx.stage.Stage;
    
    /** * Hello world! */
    public class MainApp extends Application { 
    
        public static void main(String[] args) {
            launch(args);
        }
    
        public void start(Stage primaryStage) throws Exception {
            Parent root = FXMLLoader.load(getClass().getClassLoader().getResource("Main.fxml"));
            Scene scene = new Scene(root, 600, 500);
            scene.getStylesheets().add(getClass().getClassLoader().getResource("application.css").toExternalForm());
    
            primaryStage.setTitle("Simple JavaFX");
            primaryStage.setScene(scene);
            primaryStage.show();
        }
    }

这里注意FXML和CSS资源文件的位置，如果这些文件直接放置在resources目录下面，则文件路径可以按照上面的方式书写。如果资源文件放置在resources目录下面的和源码文件带包的目录类似的目录下面，即如果放置在resources/cn/tzy/目录下面的话，则获取资源的方式应该是：`getClass().getResource("Main.fxml")`。大家可以通过观察编译以后的目录中文件的位置进行测试和实践。

### Main.fxml ###

这个文件中只有一个Button按钮

<?xml version="1.0" encoding="UTF-8"?>
    
    <?import javafx.scene.control.Button?>
    <?import javafx.scene.layout.BorderPane?>
    
    
    <BorderPane xmlns="http://javafx.com/javafx/8.0.112" xmlns:fx="http://javafx.com/fxml/1" fx:controller="cn.tzy.MainController">
       <center>
          <Button text="Click Me" BorderPane.alignment="CENTER" onAction="#handlerBtnClick" />
       </center>
    </BorderPane>

注意我们在这里设置了`fx:controller="cn.tzy.MainController"` Controller指定了如何处理用户事件，在Button的onAction属性中通过“\#处理函数名”的方式将Controller中事件处理函数绑定到UI控件上。

### MainController.java ###

handlerBtnClick函数实现用户点击按钮，然后对按钮的文本进行了更改。

package cn.tzy;
    
    import javafx.fxml.FXML;
    import javafx.scene.control.Button;
    
    import javafx.event.ActionEvent;
    
    /** * Created by tanzhenyu on 2017/6/14. */
    public class MainController { 
    
        @FXML
        public void handlerBtnClick(ActionEvent event) {
            Button btnSource = (Button) event.getSource();
            btnSource.setText("I am clicked!");
        }
    }

### application.css ###

该文件中只是象征性地设置了字体

/* JavaFX CSS - Leave this comment until you have at least create one rule which uses -fx-Property */
    
    .root{ -fx-font-size: 1.2em; -fx-font-family: "Helvetica, Arial, sans-serif"; }

切换到工程目录下面，使用`mvn clean package`命令进行编译，使用`java -jar target/HelloJavaFX.jar`运行程序。

我们的HelloWorld程序界面如下：  
![JavaFX HelloWorld][]

[SouthEast]: /images/20220614/0de31120ac9142228a9b65558e0fa5cc.png
[JavaFX HelloWorld]: /images/20220614/6e5c4c5c4119420aa0c520425f9f5a0e.png