在 NetBeans IDE 中设计 Swing GUI - 教程

在 NetBeans IDE 中设计 Swing GUI - 教程

http://netbeans.org/kb/docs/java/quickstart-gui_zh_CN.html[2010-11-25 11:09:55]

Search:

HOME / Docs & Support

在 NetBeans IDE 中设计 Swing GUI

下载 quickstart-gui.zip，其中包含以下内容：

可脱机阅读的教程 HTML 文件。

GUI 生成器功能的详细交互式演示（.swf 文件）。

本教程将指导您完成使用 NetBeans IDE GUI 生成器为一个名为 ContactEditor 的应用程序创建图形用

调整组件大小

对齐组件

调整组件锚点

设置自动调整组件大小行为

编辑组件属性

学完本教程大约需要 30 分钟。

要学完本教程，您需要具备以下软件和资源。

软件或资源 要求的版本

NetBeans IDE

版本 6.9、6.8 或 6.7

置窗体布局。

有关 GUI 生成器可视反馈的描述，可参见 GUI

生成器可视反馈图例。

创建项目

由于 IDE 中的所有 Java 开发都是在项目内进行的，因此我们首先需要新建一个用来存储源文件及其他项目文件的

ContactEditor 项目。IDE 项目是一组 Java 源文件，外加与其关联的 meta 数据，其中包括特定于项目的属性

文件、控制生成和运行设置的 Ant 生成脚本以及一个将 Ant 目标映射到 IDE 命令的

project.xml 文件。尽管

Java 应用程序通常包括几个 IDE 项目，但是，在本教程中，我们将生成一个完全存储在单个项目中的简单应用程

序。

在 NetBeans IDE 中设计 Swing GUI - 教程

http://netbeans.org/kb/docs/java/quickstart-gui_zh_CN.html[2010-11-25 11:09:55]

其中包括其 Ant 脚本、用于存储源文件和测试的文件夹以及用于存储特定于项目的 meta 数据

的文件夹。要查看项目结构，请使用 IDE 的“文件”窗口。

创建新应用程序后，您可能已注意到“项目”窗口中的“源包”文件夹包含一个空的 "<缺省包>" 节点。要继续生成界

面，我们需要创建一个 Java 容器，以便放置所需的其他 GUI 组件。在此步骤中，我们将使用

JFrame 组件创建一

个容器，并将该容器置于一个新包中。

JFrame 容器，请执行以下操作：

IDE 在

ContactEditorUI.java 应用程序内创建 ContactEditorUI 窗体和

ContactEditorUI 类，并在 GUI 生成器中打开 ContactEditorUI 窗体。请注

意，

my.contacteditor 包取代了缺省包。

现在，我们已为应用程序设置了一个新的项目，接下来让我们再花点时间来熟悉 GUI 生成器的界面。

设计区域。GUI 生成器的主窗口，用于创建和编辑 Java GUI 窗体。通过使用工具栏的“源”和“设计”切换按钮，可以查看

类的源代码或其 GUI 组件的图形视图。使用其他工具栏按钮可以方便地访问常用命令，例如，在“选择模式”和“连接模

在 NetBeans IDE 中设计 Swing GUI - 教程

http://netbeans.org/kb/docs/java/quickstart-gui_zh_CN.html[2010-11-25 11:09:55]

式”之间切换、对齐组件、设置自动调整组件大小行为以及预览窗体。

检查器。以树状分层结构的形式提供应用程序中所有组件（包括可视组件和非可视组件）的表示。“检查器”还提供有关树中

哪个组件当前正在 GUI 生成器中进行编辑的可视反馈，并允许您在可用面板中组织这些组件。

组件面板。可用组件的可定制列表，其中包含 JFC/Swing、AWT 和 JavaBeans 组件以及布局管理器的标签。此外，您也

可以使用定制器在组件面板中创建类别以及删除和重新排列其中显示的类别。

“属性”窗口。显示 GUI 生成器、“检查器”窗口、“项目”窗口或“文件”窗口中当前选定组件的属性。

如果单击“源”按钮，IDE 将在编辑器中显示应用程序的 Java 源代码，其中包括由 GUI 生成器自动生成的代码部分，这些部分将以

蓝色区域表示，称为“保护块”。保护块是“源”视图中不可编辑的受保护区域。当处于“源”视图中时，只能编辑显示在编辑器白色区

通过简化创建图形界面的工作流，IDE 的 GUI 生成器解决了创建 Java GUI 的核心问题，从而使开发者不必再使用复杂的 Swing

布局管理器。这一点是通过扩展目前的 NetBeans IDE GUI 生成器功能以支持直观的“自由设计”模式（具有易于理解和使用的简

单布局规则）来实现的。设置窗体布局时，GUI 生成器将提供可视基准线，用于建议最佳组件间距和对齐方式。在后台，GUI 生成

器会将您的设计理念转化为使用新的 GroupLayout 布局管理器和其他 Swing 结构实现的功能性 UI。由于它使用动态布局模型，

因此使用 GUI 生成器生成的 GUI 在运行时将按预期方式工作，同时会在不改变组件之间的定义关系的情况下进行相应的调整以适

应所做的任何更改。只要您调整窗体大小、转换语言环境或指定不同的外观，GUI 就会根据目标外观的插入和偏移量自动进行调

整。

自由设计

在 IDE 的 GUI 生成器中，只需像使用绝对定位那样将组件放在所需的位置，便可以生成窗体。GUI 生成器将确定

需要哪些布局属性，然后自动生成代码。您无需关注插入量、锚点以及填充之类的问题。

行为，这些关系和行为将影响 GUI 在运行时的显示和行为方式。这加快了 GUI 的设计过程，使您能够快速创建具

有专业外观和相应功能的可视界面。

先打基础

现在，您已熟悉了 GUI 生成器的界面，接下来该着手开发 ContactEditor 应用程序的 UI 了。在此部分，我们将介绍如何使用

IDE 的组件面板将所需的各种 GUI 组件添加到窗体中。

有了 NetBeans 的“自由设计”模式，您将不必再费力地使用布局管理器来控制容器内组件的大小和位置。您需要做的就是将所需的

组件拖放（或选取并放置）到 GUI 窗体中，如下面提供的各图所示。

添加组件：基础

有帮助的。许多界面设计者将此视为一种“最佳做法”技术，但对本教程来说，只需跳转至后面的预览

在 NetBeans IDE 中设计 Swing GUI - 教程

http://netbeans.org/kb/docs/java/quickstart-gui_zh_CN.html[2010-11-25 11:09:55]