扫一扫
分享文章到微信
扫一扫
关注官方公众号
至顶头条
本教程指导您如何使用NetBeans IDE GUI Builder为名为ContactEditor的应用程序创建图形用户界面(GUI)。在此过程中,您将布置一个GUI前端,使用该前端可以查看和编辑员工数据库中所包含的个人联系信息。
我们还需要在窗体的右部添加一个附加JtextField,显示每个联系人的别名。
添加JtextField的步骤:
1. 在Palette窗口中,从Swing类别选择JTextField组件。
2. 将指针移动到Nickname标签的右边,单击以放置文本字段。
JTextField将进入Jlabel左边紧挨着它的位置。
调整JTextField大小的步骤:
1. 将在上一个任务中添加的Nickname:标签的JTextField的缩放柄拖向封闭Jpanel的右边。
2. 当垂直对齐准线显示文本字段和JPanel的边缘之间的边距时,释放鼠标按键以调整JtextField的大小。
JtextField的右边缘将与Jpanel的建议的边缘边距对齐,GUI Builder将推断适当的调整大小行为。
继续下一步
对齐是创建专业级GUI的大多数基本方面之一。在上一部分中,我们了解了IDE的对齐功能,以及将JLabel和JTextField组件添加到ContactEditorUI窗体。下一步,我们进一步了解一下在使用应用程序所需的各种其他组件时GUI Builder的对齐功能。
组件对齐
每次将组件添加到窗体时,GUI Builder都会通过显示的对齐准线有效地对齐它们。但是,指定组件组之间的不同关系有时也是必要的。以前我们添加了四个ContactEditor GUI所需的Jlabel,但是我们没有对齐它们。现在我们对齐Jlabel的两个列,以便其右边缘在一条直线上。
对齐组件的步骤:
1. 在左侧窗体中选择First Name:和Nickname:Jlabel。
2. 单击工具栏中Column按钮中的Align Right ( )。或者,右键单击弹出菜单的Column中的任何一个并选择Align > Right。
3. 再为Last Name:和Nickname:Jlabel重复此步骤。
Jlabel的位置将改变,以便对齐其显示文本的右边缘。锚定关系将更新,以指示组件已分组。
在完成以前添加的JtextField之前,我们需要确保正确调整在两个Jlabel之间插入的两个JtextField的大小。与我们拉到窗体的右边缘的两个JtextField不同,插入组件的调整大小行为不是自动设置的。
设置组件的调整大小行为的步骤:
1. 按住Ctrl键单击两个插入的JTextField组件,以便在GUI Builder中选中它们。
2. 在所选的两个JtextField中,右键单击它们中的任意一个并从弹出菜单选择Auto Resizing > Horizontal。
JTextFields将被设置为在运行时水平调整大小。对齐准线和锚定指示器将被更新,从而提供组件关系的可视化反馈。
将组件设置为相同大小的步骤:
1. 按住Ctrl键单击窗体中的全部四个JtextField以选中它们。
2. 在所选的JtextField中,右键单击它们中的任意一个并从弹出菜单选择Set Default Size。
所有这些JtextField将被设置为相同的宽度,并且指示器将被添加到每个JtextField的顶部边缘,提供组件关系的可视化反馈。
现在我们需要添加描述JcomboBox的另一个Jlabel,它允许用户选择ContactEditor应用程序将显示的信息的格式。
将JLabel与组件组对齐的步骤:
1. 在Palette窗口中,从Swing类别选择JLabel组件。
2. 将指针移动到Jpanel左边的First Name和Title Jlabel之下。当准线出现,指示已将新Jlabel的右边缘与上面的组件组(两个JLabel)的右边缘对齐时,单击以放置组件。
JLabel将进入与上面的Jlabel列右对齐的位置,如下图所示。GUI Builder将更新对齐状态行,以指示组件的间距和锚定关系。
在上面的示例中,双击JLabel以选中其显示文本,可为显示名称输入Display Format:。注意,当JLabel进入位置时,其他组件将改变以适应较长的显示文本。
基线对齐
只要添加或移动包括文本的组件(如Jlabel、JtextField等),IDE就会建议基于组件中文本基线的对齐方式。例如,以前我们插入JTextField时,其基线将自动与邻近的Jlabel对齐。
现在我们将添加允许用户选择将显示的ContactEditor应用程序的信息格式的组合框。添加JcomboBox时,我们将其基线与Jlabel的文本的基线对齐。请再次注意,基线对齐准线将显示,帮助我们定位。
对齐组件的基线的步骤:
1. 在Palette窗口中,从Swing类别中选择JComboBox组件。
2. 移到指针,使其紧靠我们刚才添加的JLabel的右边。当水平准线出现,指示将JComboBox的基线与JLabel 中的文本的基线对齐,并使用垂直基线建议两个组件之间的间距时,单击以放置组合框。
该组件将进入与其右边的Jlabel的基线对齐的位置,如下图所示。GUI Builder将显示状态行,以指示组件的间距和锚定关系。
调整JComboBox大小的步骤:
1. 选择GUI Builder中的JComboBox。
2. 将JcomboBox右边缘的缩放柄向右拖,直到建议JComboBox和Jpanel边缘之间的首选偏移量的对齐准线出现为止。
如下图所示,JcomboBox的右边缘将与Jpanel的建议边缘边距对齐,组件的宽度将随窗体自动调整大小。
编辑组件模型超出了本教程的范围,所以现在我们不去管JcomboBox的占位符项列表。
回顾所学的知识
我们已经为构建ContactEditor GUI开了个好头,现在我们花点时间来回顾一下添加界面所需的几个组件时学到的知识。
到现在为止,我们一直致力于使用IDE的对齐准线帮助定位将组件添加到ContactEditor GUI中。但是,我们必须了解放置组件的另一个完整部分是锚定。尽管我们还没有讨论它,您已经得到了它的不用调整大小的好处。如上所述,只要向窗体添加组件,IDE就使用准线建议目标外观的首选位置。放置后,新组件还将被锚定到最近的容器边缘或组件,以便在运行时维护组件关系。在本部分,我们将集中于如何以更加简单的方式完成这些任务,同时指出GUI builder将在后台完成的工作。
如果您非常迫切的想了解IT领域最新产品与技术信息,那么订阅至顶网技术邮件将是您的最佳途径之一。
现场直击|2021世界人工智能大会
直击5G创新地带,就在2021MWC上海
5G已至 转型当时——服务提供商如何把握转型的绝佳时机
寻找自己的Flag
华为开发者大会2020(Cloud)- 科技行者