使用WindowBuilder设计Swing程序

红太狼 2022-06-02 10:45 228阅读 0赞

## Swing程序表示Java的客户端窗体程序，除了通过手动编写代码的方式设计Swing程序之外，Eclipse中还提供了一种WindowBuilder工具，该工具是一种非常好用的Swing可视化开发工具，有了它，开发人员就可以像Visual Studio一样通过拖放组件的方式编写Swing程序了，下面对如何使用WindowBuilder开发工具设计Swing程序进行详细介绍。 ##

### 下载WindowBuilder工具 ###

下载WindowBuilder工具有两种方法，一种方法是直接下载集成WindowBuilder工具的Eclipse，另外一种是通过Install New Software安装，下面分别介绍。

þ  下载集成WindowBuilder工具的Eclipse

在Eclipse官方网站的Eclipse下载页面提供了多种Eclipse工具，其中有一个“Eclipse IDE for Java Developers”选项，该项即集成了WindowBuilder工具，用户只需要根据自己的操作系统位数下载相应的版本即可，如图A.1所示。

![SouthEast][]

图A.1下载集成WindowBuilder工具的Eclipse

þ  通过Install New Software安装WindowBuilder工具

如果用户下载的Eclipse版本不是“Eclipse IDE for Java Developers”，这时想要使用WindowBuilder工具开发Swing程序就需要手动进行安装，步骤如下：

（1）打开Eclipse，在Eclipse菜单中选择“Help/About Eclipse”菜单，如图A.2所示。

![SouthEast 1][]

图A.2　选择“Help/About Eclipse”菜单

（2）弹出“About Eclipse”对话框，该对话框中可以看到Eclipse的版本，如图A.3所示。

![SouthEast 2][]

图A.3　查看Eclipse的版本

（3）在IE浏览器的地址栏输入网址[http://www.eclipse.org/windowbuilder/download.php][http_www.eclipse.org_windowbuilder_download.php]，进入Eclipse官网的WindowBuilder下载界面，如图A.4所示。

![SouthEast 3][]

图A.4　WindowBuilder下载界面

（4）根据自己的Eclipse版本单击对应的“Release Version”下的“Update Site”中的link链接，这里选择“4.5（Mars）”版本，进入到一个空白页，复制该空白页的网址（http://download.eclipse.org/windowbuilder/WB/release/R201506241200-1/4.5/）

（5）打开Eclipse，在Eclipse菜单中选择“Help/ Install New Software”菜单，如图A.5所示。

![SouthEast 4][]

图A.5　选择“Help/ Install New Software”菜单

（6）弹出Install对话框，如图A.6所示。

![SouthEast 5][]

图A.6　Install对话框

（7）在Install对话框中单击Add按钮，弹出“Add Repository”对话框，如图A.7所示，该对话框中，在Name文本框中输入要安装的插件名称WindowBuilder；Location文本框中输入WindowBuilder工具的更新地址（即步骤（4）中复制的http://download.eclipse.org/windowbuilder/WB/release/R201506241200-1/4.5/）

![SouthEast 6][]

图A.7　“Add Repository”对话框

（8）单击OK按钮，返回Install对话框，该对话框中选中WindowBuilder工具的更新内容，然后按照提示单击Next，即可将WindowBuilder工具安装到Eclipse中，如图A.8所示。

![SouthEast 7][]

图A.8　安装WindowBuilder工具

### 使用WindowBuilder设计窗体 ###

为Eclipse安装完WindowBuilder工具之后，就可以使用WindowBuilder设计Swing程序了，步骤如下：

（1）新建一个Java项目，在Java项目上单击右键，选择“New/Other”快捷菜单，如图A.9所示。

![SouthEast 8][]

图A.9　选择“New/Other”快捷菜单

（2）弹出New对话框，该对话框中因此展开“WindowBuilder/SwingDesigner”菜单，选中JFrame菜单项，如图A.10所示。

![SouthEast 9][]

图A.10　选中JFrame菜单项

（3）单击Next按钮，进入“New JFrame”对话框，该对话框中输入相应的包名（Package）和窗体名称（Name），如图A.11所示。

![SouthEast 10][]

图A.11　“New JFrame”对话框

注意：建JFrame窗体时，必须依赖于某一个Java项目，即“New JFrame”对话框中的“Source folder”文本框不能为空，否则，将会出现如图A.12所示的错误提示。

![SouthEast 11][]

（4）单击Finish按钮，即可创建一个JFrame窗体。创建完的JFrame窗体的java文件中，系统会自动生成部分代码，如图A.13所示。

![SouthEast 12][]

图A.13　自动生成的JFrame窗体代码

（5）单击底部的Design选项卡，可以切换到可视化设计界面，如图A.14所示，该界面中有3个主要区域，分别是组件工具箱、窗体设计区和属性，其中，组件工具箱提供了设计Swing程序所需的布局管理器、容器和各种组件；窗体设计区主要用来对窗体进行可视化的设计；属性区域用来对窗体或者组件的相关属性进行设置，这样就省去了编写代码设置属性的过程，更加方便快捷。

![SouthEast 13][]

图A.14　JFrame可视化设计界面

（6）在可视化设计界面中，用户可以根据自己的实际需要在窗体中绘制相应的组件，并对组件的属性进行设置，绘制组件的具体操作为：在左侧“组件工具箱”选中单击要显示在窗体上的组件，然后将鼠标移动到“窗体设计区”，会显示一个带绿色原点的鼠标形状，在某个区域单击鼠标左键，即可绘制一个相应的组件，如图A.15所示。

![SouthEast 14][]

图A.15　在JFrame窗体中绘制组件

说明：创建完JFrame窗体后，默认的布局方式为BorderLayout边界布局，如果想要取消布局，可以直接在窗体设计区按Delete键删除，然后切换到.java文件（单击底部的Source选项卡），将setLayout方法的参数设置为null。

感谢读者朋友对明日科技的支持，如果您对图书中的讲解及光盘源码有任何问题，可以直接登录http://www.mingrisoft.com上的社区进行发贴，把您的问题详细的说明一下，我们的技术人员会在那里给您回复！

[SouthEast]: /images/20220602/bbc7c4d0913741b5a05c0c04a49263ea.png
[SouthEast 1]: /images/20220602/b765378bd2ce4a488095135f507c54be.png
[SouthEast 2]: /images/20220602/33d00e0a635c4b528812ac6f4d08d61a.png
[http_www.eclipse.org_windowbuilder_download.php]: http://www.eclipse.org/windowbuilder/download.php
[SouthEast 3]: /images/20220602/97339fcfb350453d80516af636f1ddd0.png
[SouthEast 4]: /images/20220602/37bf033af3e946669bd3b911ff9f318f.png
[SouthEast 5]: /images/20220602/55bb09985b394b76b4a047977e111e22.png
[SouthEast 6]: /images/20220602/de92e1d063264d399a4e13c8dced4b58.png
[SouthEast 7]: /images/20220602/138fe915bcce4ac9a624ce25f051174f.png
[SouthEast 8]: /images/20220602/b8b40e5737454dfc9042af99d0424f69.png
[SouthEast 9]: /images/20220602/de42a5eb43e1415b83550a13ac887102.png
[SouthEast 10]: /images/20220602/f6a171fabed2479c93bc4327720714bf.png
[SouthEast 11]: /images/20220602/f8e3ef1ab3d347a5a2c45019518e8822.png
[SouthEast 12]: /images/20220602/ccdeaf8ca98047e5935113b0f5017747.png
[SouthEast 13]: /images/20220602/d03e7054eeb04c29a5f17e1e5d647a8a.png
[SouthEast 14]: /images/20220602/451a02339ad94719a6487bcb69977866.png