欢迎您访问 最编程 本站为您分享编程语言代码,编程技术文章!
您现在的位置是: 首页

javafx 场景生成器窗口关闭事件 javafx 场景生成器教程

最编程 2024-03-08 19:07:01
...


1、前言

当我们使用JavaFX来写一个GUI时,往往会感觉用代码做界面设计是一件非常麻烦的事。因此,我们需要去掌握使用FXML文件来设计界面,用Controller类来控制界面里面的所有action,这是为了做到界面与代码分离。

本文就是介绍一款配合FXML文件使用的GUI界面设计工具。它有什么用呢?有了它,你就可以做到仅仅依靠拖拽即可完成设计以及自动生成FXML文件。

2、环境准备

准备:

  1. IDE推荐Intellij IDEA;
  2. jdk必须是1.8,1.8自带JavaFX包;
  3. 主角:SceneBuilder,一款用来设计界面的轻量级软件,可以通过拖拽控件来进行页面设计。
    下载地址:https://gluonhq.com/products/scene-builder/

配置步骤:

  1. 下载并安装SceneBuilder;
  2. 打开IDEA,进入设置,搜索“JavaFX”,配置SceneBuilder安装路径

3、SceneBuilder使用流程

使用SceneBuilder最大的好处是FXML不再需要我们手动敲代码地设计样式,接下来我们按步骤演示一下SceneBuilder的使用流程。

步骤:

  1. 创建一个普通的maven工程,jdk配置必须1.8。
  2. 新建一个MySceneController.java,这个控制类用来控制FXML文件中的一系列action。
  3. 新建一个FXML File,将fx:controller的属性值配置为全类名,代表与刚刚创建的controller类关联上了。
  4. 目前现在FXML文件还是空的,那么接下来要借助SceneBuilder来做界面设计,启动SceneBuilder,File-open,找到我们的fxml文件打开。
  5. 在左边Library搜索“button”,找到button,点击,拖动到AnchorPane上,双击修改文本。
  6. 右边有3个菜单栏,分别是:Properties(属性),Layout(布局),Code(代码)。
  7. 点击“Code”,把“fx:id”的值修改为“okayButton”(fx:id其实就对应了这个button的变量名),在“On Action”的值修改为“okay”(其实就是这个button触发的事件的方法名)。
  8. 接下来我们来预览一下界面效果,工具栏Preview->Show Preview In Window,或者快捷键Ctrl+P,就可以预览效果啦。
  9. 此外,工具栏的View->Show Sample Controller Skeleton,可以给我们自动生成对应的Controller类的代码骨架啦,可以复制到对应的类,其中包含了所有命名的组件,比如刚刚我们设置的“okayButton”;
  10. 现在我们给okay的事件补充一下内容,这里的事件设置每点一次,就在控制台打印“ok”。
  11. 现在我们还需要一个主类来启动,创建一个类继承Application。
  • 这里要注意,getResource()这里的参数要对应代码编译后的fxml文件路径,否则会报空指针异常。
  1. 到这里就大功告成了,看执行效果。
  • 这样就完成了界面设计与代码分离的目的啦!