SpringBoot整合JavaFX进行桌面应用开发

青旅半醒 2024-03-25 22:41 48阅读 0赞

**目录**

一、创建一个spring boot工程

二、导入JavaFX依赖

三、创建fxml文件以及controller类文件

3.1 创建一个fxml文件

3.2 创建对应的controller文件

四、Scene Builder的使用

4.1 下载安装

4.2 运行

4.3 界面编辑

五、 修改主启动类

六、测试运行

七、Jfoenix

学习参考：

--------------------

## 一、创建一个spring boot工程 ##

第一步，我们直接使用Spring Initializr构建一个Springboot工程![e48ade4c22204a1baed8e9891125164f.png][]

啥都不用选，立即添加，当然你要添加也可以。注意我们这里不是web项目，不用添加web相关依赖![c565c95693e14d29af6b412c69e47b8a.png][]

## 二、导入JavaFX依赖 ##

<dependency>
        <groupId>de.roskenet</groupId>
        <artifactId>springboot-javafx-support</artifactId>
        <version>2.1.6</version>
    </dependency>

![5e001e476da24499aabca6719d0e0dc8.png][]

## 三、创建fxml文件以及controller类文件 ##

**什么是fxml文件？**

FXML是一种以XML的格式表示JavaFX界面对象的文件,FXML文件中的每一个元素可以映射到JavaFX中的一个类,每个FXML元素的属性或者其子元素都可以映射为该对应JavaFXML类的属性。

**说白了就是控制这个界面的文件，可以理解为界面的代码表示~~**

**为什么需要Controller类文件？**

用来绑定这个fxml文件用的，用于控制这个界面的一些操作，实现一些功能~~

### 3.1 创建一个fxml文件 ###

![61e3c870a3cd404390a573e5846a2517.png][]

![e3c5f003bcf34bfe942158253653b141.png][]

### 3.2 创建对应的controller文件 ###

![4b514a9017894d10be278e7a04d648f1.png][]

![ce137b9d23234a19a555a51322184b87.png][]

现在我们就可以通过JavaFX相关的代码直接上手了。

但是，考虑到写代码比较麻烦，这里提到一款工具Scene Builder。

可以帮助我们自动生成UI界面相关的fxml文件和对应的controller类，只不过具体的处理逻辑需要我们写罢了。

## 四、Scene Builder的使用 ##

Scene Builder作为一款Java拖拽式页面设计编码工具，具有强大的拖拽设计能力，对于一些入门以及需要快速响应页面编码的情况，该工具的效果绝对令人满意。

### 4.1 下载安装 ###

略，网上一大把

### 4.2 运行 ###

选中我们创建的fxml文件，右键选择Open In SceneBuilder打开

![56bfb8c4e37240a99a38c0d7b2671b68.png][]

### 4.3 界面编辑 ###

会自动打开Scene Builder的窗口，我们只需要拖拽响应的组件到场景中，添加设置即可。例如：

![d7556f1e5124464fa55f963e2bf34009.png][]

然后它会自动为我们的test.fxml文件添加对应的视图相关的代码

![9ea6e01981b24df082395897e5c7d78d.png][]

下面，我们只需要生成对应的控制器代码即可。自行复制过去

![c9665fde4b8f4d28979379272b93ed82.png][]

![346f3026c85946f3ac6b86533daf51d9.png][]

![ff4657d8bdaf4d7ca889e6c009935afe.png][]

## 五、 修改主启动类 ##

如下：

![cc7ff7c4e2c4409eadd12d113499e457.png][]

## 六、测试运行 ##

启动刚才的main方法，运行看看效果，ok

![d8d1fab4a8c04339a7a9cf7e21eb5128.png][]

## 七、Jfoenix ##

我们发现JavaFX提供的原生组件的样式都很丑，那么有没有一些第三方的样式组件可以供我们使用呢？答案是有的。比如这个Jfoenix。

JavaFX是一个Java库，可以使用它开发富互联网应用程序。然而原生的UI控件不是很好看，  
而Jfoenix则是一位大佬开发的仿谷歌的MD设计的UI控件。

使用方法可是相当简单的，只需要额外再引入依赖即可。

<dependency>
        <groupId>com.jfoenix</groupId>
        <artifactId>jfoenix</artifactId>
        <version>8.0.10</version>
    </dependency>

![c1243f883dad43aaa2b0b1332dde4dea.png][]

这样，我们就可以在fxml文件中使用相应的组件标签即可。

当然了，如果我们不想自己写，使用Scene Builder的话，那么相应的Scene Builder工具也需要引入Jfoenix的jar包。

![5b9bc2e190a54341aa2d1776e22f6ac4.png][]

进入后，只需要设置一下jar包的位置，即把我们刚才在maven中导入的jar包指向它就可以了。

![daa11580ffab4a0f9b6c929d2f6b6c86.png][]

此时，我们发现就多出了很多组件

![67f3e35975a9403593b3b5fd2166c914.png][]

下面我们修改一下页面，看看

![bca0fb6068d64b9ab72667e0c587a9fe.png][]

![bcaf2a97c0164417b3affcbeaeb73192.png][]

![44d4df9bc979446fb54c119c8f3adc39.png][]

重启测试看看

![28865aa8945249f4a4c91849d8cfc019.png][]

## 学习参考： ##

[IntelliJ IDEA中配置SceneBuilder\_根根根生的博客-CSDN博客][IntelliJ IDEA_SceneBuilder_-CSDN]

[JavaFX+Jfoenix 学习笔记（序）--引言And软件截图\_足信方为的博客-CSDN博客][JavaFX_Jfoenix _--_And_-CSDN]

[JavaFX之Scene Builder的使用（开发一款GUI小工具原来这么简单）\_scenebuilder使用教程\_Killing Vibe的博客-CSDN博客][JavaFX_Scene Builder_GUI_scenebuilder_Killing Vibe_-CSDN]

[JFoenix中文教程：2、JFXButton按钮组件\_蜡笔小新历险记的博客-CSDN博客][JFoenix_2_JFXButton_-CSDN]

[JavaFX SceneBuilder设置按钮的背景颜色\_学亮编程手记的博客-CSDN博客][JavaFX SceneBuilder_-CSDN]

[JavaFX之Scene Builder详细使用说明之组件篇（2）——常用组件\_scenebuilder\_二木成林的博客-CSDN博客][JavaFX_Scene Builder_2_scenebuilder_-CSDN]

[JavaFx界面设计【SceneBuilder版】适合初学者\_javafx漂亮界面\_小和尚0421的博客-CSDN博客][JavaFx_SceneBuilder_javafx_0421_-CSDN]

[JavaFX学习笔记（最全，最详细）\_setopacity(0.5);\_小番茄夫斯基的博客-CSDN博客][JavaFX_setopacity_0.5_-CSDN]

[e48ade4c22204a1baed8e9891125164f.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/e65baf13eb574c44bce0c60a87715d08.png
[c565c95693e14d29af6b412c69e47b8a.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/4d8016d2f38b40bcaf3f2d0c45d3b863.png
[5e001e476da24499aabca6719d0e0dc8.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/492e6e23b8ac4debbb5d535c53b2f5f8.png
[61e3c870a3cd404390a573e5846a2517.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/835275686e9143a9a4abb63ac9c13c45.png
[e3c5f003bcf34bfe942158253653b141.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/e99954318e844ba986c5471f8df7f0db.png
[4b514a9017894d10be278e7a04d648f1.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/f519da6f9df048ed9f2d077c78c8bc19.png
[ce137b9d23234a19a555a51322184b87.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/604d222973674e6abdf9af55362c24d8.png
[56bfb8c4e37240a99a38c0d7b2671b68.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/7c30a5a674e9425a804ee95a704bedfe.png
[d7556f1e5124464fa55f963e2bf34009.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/12657dfc1c454bc78db889643fb8ae50.png
[9ea6e01981b24df082395897e5c7d78d.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/3019d58d901d4c7d8f5e9dcdc50d7bfc.png
[c9665fde4b8f4d28979379272b93ed82.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/5bfed7be7d104ccf8a91e6cbd3b37cfd.png
[346f3026c85946f3ac6b86533daf51d9.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/fb78c7bec2e143c1bf2239b7e37ef3a4.png
[ff4657d8bdaf4d7ca889e6c009935afe.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/9f1f34496f5f47e3bdc9bd6bcd0d535a.png
[cc7ff7c4e2c4409eadd12d113499e457.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/32d7af2e69874a1485d5b3443ddcb10a.png
[d8d1fab4a8c04339a7a9cf7e21eb5128.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/556e7a30e63545a4a883c8de5f6f6d48.png
[c1243f883dad43aaa2b0b1332dde4dea.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/d57cb636ba5b405784691c61fcb75258.png
[5b9bc2e190a54341aa2d1776e22f6ac4.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/613d2a1b2ec04e98bad0140f223b7f10.png
[daa11580ffab4a0f9b6c929d2f6b6c86.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/f0ef86b306b246e5a3255a302280435d.png
[67f3e35975a9403593b3b5fd2166c914.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/92504fdfe5574f25bd4ab3bf438a7ddd.png
[bca0fb6068d64b9ab72667e0c587a9fe.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/3eb37a20698e4c5d91766665b87e3d49.png
[bcaf2a97c0164417b3affcbeaeb73192.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/8b3d826adc684517af7200071bf28e69.png
[44d4df9bc979446fb54c119c8f3adc39.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/2e1f6ced50b045a59a276aa2ee40a771.png
[28865aa8945249f4a4c91849d8cfc019.png]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/001361572d2c41049449f308737ca69c.png
[IntelliJ IDEA_SceneBuilder_-CSDN]: https://blog.csdn.net/qq_41998273/article/details/102397178
[JavaFX_Jfoenix _--_And_-CSDN]: https://blog.csdn.net/qq_26486347/article/details/96351581
[JavaFX_Scene Builder_GUI_scenebuilder_Killing Vibe_-CSDN]: https://blog.csdn.net/qq_43575801/article/details/127920378
[JFoenix_2_JFXButton_-CSDN]: https://blog.csdn.net/muyoufansem/article/details/112008598
[JavaFX SceneBuilder_-CSDN]: https://blog.csdn.net/a772304419/article/details/117228445
[JavaFX_Scene Builder_2_scenebuilder_-CSDN]: https://blog.csdn.net/cnds123321/article/details/104507487
[JavaFx_SceneBuilder_javafx_0421_-CSDN]: https://blog.csdn.net/ybny0421/article/details/127097008
[JavaFX_setopacity_0.5_-CSDN]: https://blog.csdn.net/weixin_45644335/article/details/106712103