java fx fxml界面_使用 JavaFX 2.0 FXML 呈现企业应用程序的 UI

使用 JavaFX 2.0 FXML 呈现企业级应用程序 UI

作者：James L. Weaver

使用 FX 标记语言的强大功能定义企业级应用程序的 UI。 2012 年 6 月发布

下载：

：示例项目(Zip 格式)

JavaFX 2.0 是一个用于创建富互联网应用程序 (RIA) 的 API 和运行时。JavaFX 于 2007 年推出，2011 年 10 月发布了 2.0 版本。该版本的一个优点是可以在成熟、熟悉的工具中通过 Java 语言编写代码。FX 标记语言 (FXML) 是 JavaFX 2.0 附带的一种工具，本文重点介绍了如何利用这种工具的功能快速定义企业级应用程序的用户界面。

FXML 支持使用 XML 呈现 UI。包含 FXML 功能的类位于 javafx.fxml 包中，其中包括 FXMLLoader、JavaFXBuilderFactory 以及一个名为 Initializable 的接口。本文提供了一个示例，演示了如何运用 FXML 和 JavaFX 2.0 的功能创建企业级应用程序。

SearchDemoFXML 应用程序概述

为帮助您了解如何在 JavaFX 2.0 应用程序中利用 FXML 功能，本文将使用一个名为 SearchDemoFXML 的示例应用程序。如图 1 所示，该应用程序包含以下内容： 一个 TextField 和一个 Button，用于搜索 iTunes 中的媒体

一个 TableView，用于显示搜索结果

一个 ImageView，用于查看选所专辑的封面

一个 Button，可以打开浏览器选项卡，预览所选标题的音频/视频剪辑

您将在下一节中下载 SearchDemoFXML 项目，其中包含该应用程序的代码，本文将着重探讨其中的部分代码。

图 1：SearchDemoFXML 应用程序的屏幕截图

如图 2 所示，在文本字段中输入歌曲名称、专辑名称或艺术家姓名并单击按钮之后，UI 右上角将出现一条提示信息，表示正在进行搜索。此外，该按钮的外观会发生变化，提示可以单击按钮取消搜索。在搜索过程中，文本字段将被禁用。

图 2：SearchDemoFXML 在搜索过程中的屏幕截图

如图 3 所示，单击 Preview 按钮将在默认浏览器中打开一个新选项卡，预览音频或视频剪辑：

图 3：播放视频剪辑的浏览器选项卡

获取并运行 SearchDemoFXML 项目 下载 NetBeans 项目文件，该文件中包含 SearchDemoFXML项目。

将该项目解压缩到您选择的目录。

启动 NetBeans，选择 File -> Open Project。

在 Open Project 对话框中，转至所选目录后打开 SearchDemoFXML项目，如图 4 所示。如果收到一个声明无法找到 jfxrt.jar 文件的消息，则单击 Resolve 按钮并转至 JavaFX 2.0 SDK 安装目录下面的 rt/lib 文件夹。

注：可以从 NetBeans 网站获取 NetBeans IDE。

图 4：在 NetBeans 中打开 SearchDemoFXML 项目 要运行该应用程序，请单击工具栏上的 Run Project 图标或按下 F6 键。Run Project 图标外观类似媒体(例如，DVD)播放器上的 Play 按钮，如图 5 所示。

图 5：在 NetBeans 中运行 SearchDemoFXML 程序

SearchDemoFXML应用程序应显示在一个窗口中，如前面图 1 中所示。继续使用该应用程序，搜索歌曲、专辑和艺术家。完成上述操作后，我们就可以继续分析此应用程序，并探讨 FXML 相关代码。

分析 SearchDemoFXML 应用程序

在深入研究代码之前，我们先来分析图 6 所示的各个片段，这些片段共同组成了 SearchDemoFXML 应用程序。

图 6：SearchDemoFXML 应用程序示意图

让我们先从图 6 左上角的 SearchDemo.java 开始，它是这个 JavaFX 应用程序的主要模块，扩展了应用程序并且包含 main() 和 start() 方法。在 SearchDemoFXML 应用程序中，该模块的用途是创建一个场景，通过 FXMLLoader.load() 方法从 search_demo.fxml 文件中获取场景图，并使用获取到的场景图填充场景。这就生成了图 6 左下角显示的 UI。

图 6 顶部中间位置的 search_demo.fxml 文件包含这个场景图的 XML 表示。此外，该文件还指定 SearchDemoController.java 文件是一个控制器类，它将 UI 组件发生的事件委托给控制器中的 handler 方法。

图 6 底部中间位置的 SearchDemoController 控制器类保存 search_demo.fxml 文件中对 UI 组件的引用，并处理这些组件发生的事件。

转到图 6 的右侧，SearchDemoController 调用 RestFX 类的方法来查询 iTuens 服务的 REST 接口。RestFX 是 JavaFX 2.0 外部的一个库，这里使用它来与 iTunes REST 端点通信，并分析端点的 JSON 响应