本教程详细介绍了如何利用NetBeans IDE的GridBag定制器进行高级Java窗体设计，包括插入新行、添加组件、调整布局、引入子容器等，帮助开发者实现复杂GUI组件的精确布局。
使用 GridBag 定制器设计高级 Java 窗体
作者：Jan Stola、Tomas Pavek 和 Alyona Stashkova
本教程是一个系列教程的第二部分(共两个部分)，介绍了如何使用 NetBeans IDE GridBag 定制器的高级功能设计高级 Java 窗体。
该系列教程可作为一个指南，介绍了如何设置 GUI 组件布局而无需手动编写布局代码，然后在现有窗体中进行其他更改，以实现项目所需的特定目标布局。
该系列教程中的每个文档都介绍了一组特定的功能。
第 2 部分：使用 GridBag 定制器设计高级 Java 窗体
该系列中的第一个教程介绍了如何使用 NetBeans IDE GridBag 定制器的基本功能修改简单的 Java 窗体。在本教程中，将了解如何使用 GridBag 定制器的高级功能更改现有的窗体布局。
目录
要学习本教程，您需要具备以下软件和资源。
注：
您可以将用作该系列教程起点的项目作为 .zip 档案文件进行下载。
本教程仅重点介绍如何设计容器的布局。在 GUI 中添加功能超出了本教程的范围。
打开示例项目
在开始借助 GridBag 定制器设置组件布局之前，请下载 gbcustomizer-advanced-tutorial.zip，将 GridBagCustomizerAdvancedTutorial 项目解压缩到您的硬盘驱动器上，然后在 NetBeans IDE 中打开该项目。
在 NetBeans IDE 的 "Projects"(项目)标签中，单击 "File"(文件)菜单上的 "Open Project"(打开项目)，导航至在上一步中解压缩的 GridBagCustomizerAdvancedTutorial 项目，然后单击 "Open Project"(打开项目)。项目文件夹可能包含在也称为 GridBagCustomizerAdvancedTutorial 的文件夹中。
注：GridBagCustomizerAdvancedTutorial 项目使用 JUnit 和 JUnit 4 类库，这些库位于更新中心内。需要在 "Open project"(打开项目)对话框中单击 "Resolve Problems"(解决问题)，然后在 "Resolve Reference Problems"(解决引用问题)对话框中单击 "Resolve"(解决)，并按照 NetBeans IDE 安装程序中的说明安装 JUnit 插件。安装完成后，单击 "Finish"(完成)以关闭 "NetBeans IDE Installer"(NetBeans IDE 安装程序)对话框，然后单击 "Close"(关闭)以关闭 "Resolve Reference Problems"(解决引用问题)对话框。
展开源包 > tutorial，然后双击 ContactsAdvancedInitial.java。
此时将在 GUI 构建器的 "Design"(设计)视图中打开样例窗体。
调用 GridBag 定制器
要显示 GridBag 定制器，请完成以下步骤：
在 "Design"(设计)视图中，选择 "JFrame Form"(JFrame 窗体)。
右键单击该窗体，然后选择 Customize Layout(定制布局)。
此时将打开 "Customize Layout"(定制布局)对话框，如下所示。
注：在本教程中，已设置了 GridBagLayout。如果使用其他窗体，请在上面的步骤 2 中右键单击该窗体，选择 Set Layout(设置布局)> Grid Bag Layout(网格包布局)(这将启用 Customize Layout(定制布局)菜单项)，然后完成该步骤。
高级功能
在本部分中，将使用 GridBag 定制器的高级功能，按照下面显示的目标布局重新组织 ContactsAdvancedInitial 窗体组件。
注：要在 NetBeans IDE 中查看目标布局，请在 "Projects"(项目)标签中，展开 "Source Packages"(源包)> "tutorial"(教程)，然后双击 ContactsAdvancedFinal.java。
此时将在 GUI 构建器的 "Design"(设计)视图中打开具有目标布局的 ContactsAdvancedFinal 窗体。
插入新行
现有窗体的 Phone 部分包含三个电话条目。要改进该部分并添加额外的标签和文本字段(例如，在 Cell Phone: 和 Home Phone: 之间插入 Skype 用户名)，请在该位置创建一个新行，如下所示：
在 "Customize Layout"(定制布局)对话框中，右键单击包含 Home Phone: 信息的行标题。
选择 Insert Row Before(在前面插入行)。
此时将添加一个新行，如下图所示。
添加新组件
要在新添加的行中添加新标签和文本字段，请完成以下步骤：
右键单击新添加的行的第一个单元格。
从上下文菜单中，选择 "Add Components"(添加组件)> "Swing Controls"(Swing 控件)> "Label"(标签)，如下所示。
此时将在第一个单元格中突出显示 JLabel1。
右键单击新添加的行的第二个单元格。
从上下文菜单中，选择 "Add Components"(添加组件)> "Swing Controls"(Swing 控件)> "Text Field"(文本字段)。
此时将在第二个单元格中突出显示 JTextField1。
在添加组件后，必须指定这些组件的 GridBag 约束，使之与其他组件对齐。
在网格区域中选择了 JTextField1 组件的情况下，在属性表单中执行以下操作：
在 "Grid Width"(网格宽度)组合框中，输入 3，然后按 Enter 键。
在 "Fill"(填充)组合框中，选择 Horizontal(水平)。
在 "Anchor"(锚点)组合框中，向下滚动并选择 Baseline(基线)。
在 "Weight X"(X 粗细)文本字段中，输入 1.0，然后按 Enter 键。
在网格区域中，选择 JLabel1 组件，然后在属性表单中向下滚动并选择基线前导以指定其 Anchor(锚点)约束。
在网格区域中同时选择 JLabel1 和 JTextField1 组件，单击 Insets(插入量)文本字段右侧的浏览按钮 (
)。此时将显示 Insets(插入量)对话框。在 Top:(上：)文本字段中输入 5，然后单击 "OK"(确定)。
窗体应如下所示。
注：GridBag 定制器可帮助您在布局中添加和删除组件以及更改组件的位置。要更改布局中的组件属性(如背景或文本)，请使用 GUI 构建器的 "Design"(设计)窗口。
要设置 JLabel1 的显示文本，请执行以下操作：
单击 "Close"(关闭)，以关闭 "Customize Layout"(定制布局)对话框。
在 "Design"(设计)视图中，选择 JLabel1 组件，然后按 F2 键(或者，从上下文菜单中选择 "Edit Text"(编辑文本))。
删除选定的文本，然后输入 Skype:。
按 Enter 键。
要删除 JTextField1 组件的文本，请完成以下步骤：
在 "Design"(设计)视图中，选择 JTextField1 组件，然后按 F2 键(或者，从上下文菜单中选择 "Edit Text"(编辑文本))。
删除选定的文本，然后按 Enter 键。
重新组织布局
GridBag 定制器允许您根据需要快速调整窗体组件的位置，节省了您的时间和精力。
要更改 Phone 部分的布局以及将四个现有文本字段从一列更改为两列(各包含两个文本字段)，请完成以下步骤：
右键单击该窗体，然后从上下文菜单中选择 Customize Layout(定制布局)。
在 "Customize Layout"(定制布局)对话框中，按住 Ctrl 键单击四个 JTextField 组件将其选中。
将文本字段的右边缘拖放至左侧，以使这些文本字段仅占据第二个网格列；换而言之，使它们不再占据第三个和第四个网格列。
GridBag 定制器可以同时调整几个组件的大小，从而为文本字段的第二列腾出空间。
在窗体外部单击以取消选择调整了大小的文本字段。
按住 Ctrl 键单击以选择 Phone 部分的所有 Skype:、Home Phone: JLabel 和 JTextField 组件。
将光标放在所选组件上，然后将其拖至上面两个文本字段的右侧。
注：在拖动之前，请确保光标未变为双向箭头，否则，将需要调整所选组件的大小。
在移动组件后，窗体应如下所示。
要删除多余的第 10 和 11 行(行索引分别为 9 和 10)，请右键单击行标题，然后从上下文菜单中选择 Delete Row(删除行)。
Phone 部分将变得更加紧凑。
要固定此处的第二列的间距，请执行以下操作：
在网格区域中，按住 Ctrl 键单击 Skype: 和 Home Phone: 标签将其选中。
单击 Insets(插入量)文本字段右侧的浏览按钮 (
)。
此时将显示 Insets(插入量)对话框。
在 Left:(左侧：)文本字段中输入 5，然后单击 "OK"(确定)。
引入子容器
基于网格的布局有时会引入不必要的依赖关系，需要通过子容器进行解决。
如果单击工具栏中的 "Test Layout"(测试布局)(
) 按钮并测试当前布局的水平大小可调性，则可以看到在 "Browse"、"OK" 和 "Cancel" 按钮周围创建了多余空间。
发生这种情况的原因是，第四列同时包含文本字段和按钮(这两种组件分别需要增大和减小)。您需要修改布局以使 Street 和 City: 文本字段占据 Browse 按钮周围的额外空间。当前布局确保了 Street: 和 City: 文本字段右边缘的垂直位置与 Home Phone: 文本字段左边缘相同。要使这些位置没有关联，请完成以下步骤：
按住 Ctrl 键单击 Street: 文本字段及其右侧的 Browse 按钮将其选中。
右键单击所选内容，然后从上下文菜单中选择 Enclose in Container(包含在容器中)。
在将组件包含在子容器中后，Home Phone: 标签和文本字段之间的边界不再影响 Street 文本字段和按钮之间的边界。
注：Enclose in Container(包含在容器中)操作将在选定组件占据的单元格中创建一个新的子容器。它将选定组件移到新引入的容器中，但保留其相对位置和其他布局约束。
对于 City: 文本字段及其右侧的 Browse 按钮，重复上面列出的两个步骤，以便将其包含在子容器中，如下所示。
现在，您希望按如下方式删除 OK 和 Cancel 按钮周围的多余空间：
单击 "Close"(关闭)取消选择包含在子容器中的组件，右键单击窗体，然后从上下文菜单中选择 Customize Layout(定制布局)。
按住 Ctrl 键单击窗体底部的 OK 和 Cancel 按钮将其选中。
右键单击所选内容，然后从上下文菜单中选择 Enclose in Container(包含在容器中)。
此时将为这些按钮创建一个新的子容器。
注：无法调整子容器中的任何组件的大小。因此，这些组件将彼此相邻放在容器的中心位置(这是默认锚定方式)。
要更改整个子容器的锚定方式，请完成以下步骤：
请确保选中了带有 OK 和 Cancel 按钮的子容器，然后单击 Anchor(锚点)组合框右侧的箭头按钮 (
)。
向下滚动并从列表中选择 Line End(行尾)。
布局效果看起来很好，但包含 OK 和 Cancel 按钮的子容器仅占据最后一行中的最后两个单元格。
如果 OK 和 Cancel 按钮变宽(例如，在翻译为不同语言期间)，则这些按钮会将 Work Phone: 和 Cell Phone: 文本字段的右边缘向后推。
为避免出现这种潜在的问题，并使子容器占据底部行中的所有单元格，请选择该子容器，然后将其左边框拖至行的开头。
子容器将占据底部行的所有单元格。
在容器之间导航
要在子容器中添加组件(例如，在现有 OK 和 Cancel 按钮的基础上添加 Help 按钮)，您需要在编辑子容器布局之前从主容器切换到子容器。
完成下面列出的步骤，在现有子容器中添加一个按钮：
单击包含 OK 和 Cancel 按钮的子容器将其选中。
右键单击该容器以显示上下文菜单，然后从该菜单中选择 Design This Container(设计此容器)。
右键单击第二列的标题，然后从上下文菜单中选择 Insert Column After(在后面插入列)。
此时将显示新按钮的空单元格。
在新创建的单元格内右键单击，然后从上下文菜单中选择 Add Component(添加组件)> Swing Controls(Swing 控件)> Button(按钮)。
此时将添加一个新的 jButton1 按钮。
单击属性定制器中的 "Baseline-Related Anchor"(与基线相关的锚点)按钮 (
)，将新按钮与行中的两个现有按钮对齐。
单击 "Insets"(插入量)文本字段右侧的浏览按钮 (
)。此时将显示 "Insets"(插入量)对话框。在 "Top:"(上：)文本字段中输入 5，然后单击 "OK"(确定)。
要立即查看主容器布局的外观，请右键单击设计的子容器，然后从上下文菜单中选择 Design Parent Container(设计父容器)。
注：如果右键单击这些按钮，则不会显示上下文菜单。
布局设计现已完成。
只剩下与容器布局无关的最终更改。
要重命名该按钮，请完成以下步骤：
单击 "Close"(关闭)，以关闭 "Customize Layout"(定制布局)对话框。
在 "Design"(设计)视图中，单击 jButton1 组件，然后按 F2 键(或者，从上下文菜单中选择 "Edit Text"(编辑文本))。
删除选定的文本，然后输入 Help。
按 Enter 键。
小结
在本教程中，您通过添加新组件、插入行等操作修改了现有窗体。在设计布局时，您了解了如何使用 GridBag 定制器的高级功能重新组织窗体布局。
另请参见
现在，您已完成了“使用 GridBag 定制器设计高级 Java 窗体”教程。有关向所创建的 GUI 中添加功能的信息，请参见：
255
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
