用Eclipse进行可视化JAVA界面设计文档格式.docx
- 文档编号:20422559
- 上传时间:2023-01-22
- 格式:DOCX
- 页数:14
- 大小:302.86KB
用Eclipse进行可视化JAVA界面设计文档格式.docx
《用Eclipse进行可视化JAVA界面设计文档格式.docx》由会员分享,可在线阅读,更多相关《用Eclipse进行可视化JAVA界面设计文档格式.docx(14页珍藏版)》请在冰豆网上搜索。
但当前的VE版本是0.5.0RC1,只在windows和linux平台上经过测试。
所以如果你使用的是这两种操作系统之外的其它操作系统,你应该先阅读VE的readme文件,安装和使用VE前,必须先安装以下版本的eclipse和相关支持类库:
Eclipsebuild2.1.2(buildpage)(downloadzip)
EMFbuild1.1.1:
(buildpage)(downloadzip)
GEFBuild2.1.2:
为了方便中国的开发者,eclipse也提供了一个中文语言包,下载安装后,elcipse环境将变成全中文的界面。
在本文中,笔者用的eclipse也安装了此中文语言包。
之后就可以从以下地址下载VisualEditor了:
http:
//download.eclips.org/vep….
下载后的VE是一个zip档案,请将其压缩包中plugins和features目录下的内容解压到eclipse安装目录的相应目录中即可。
如果你的eclipse是运行着的,请关闭并重新启动eclipse。
开始一个设计任务
现在,所有程序安装完成,笔者将用一个例子,来讲解VisualEditor的使用。
在这个例子中,笔者要设计一个邮件发送面板,下面是它的草图:
此面板包括发送人,接收人,邮件主题,邮件内容以及发送和清除按钮,
进入VisualEditor
启动eclipse平台。
刚开始,你可能觉得eclipse并没有什么变化。
先别急,请新建一个项目,点击"
文件"
菜单下的"
新建"
子菜单,选择并建立一个新的"
java项目"
。
然后在工具栏上的"
新建Java类"
图标上,点击右边的小箭头
,将展开如下图的菜单:
在此菜单上,多了一个"
VisualCalss"
的子菜单,这就是进入VisualEditor的入口之一。
点击"
VisualClass"
,弹出如下的对话框:
在此对话框中,要求输入类的名称(如标记○1)位置),在这里我们输入"
MessagePanel"
,以及你想要继承的可视类(如标记○2位置)。
你可以选择继承来自swing或AWT的任何界面组件,如要继承其它类型的类,请选择"
other"
并点击"
浏览"
按钮来选择你要继承的类。
在此处,我们选择"
panel"
和Swing选项,继承JPanel,然后点击"
完成"
按钮,大家就可以见到VisualEditor的界面了:
由于eclipse工作台高度的可定制性,读者现在看到的界面并非VE初始的布局,而是经过笔者按喜好的方式重新布局过的透视图,但是这并不会影响读者理解本文内容。
如图中1所示,是VE的工具面板,提供"
选取"
、"
框选"
等选择工具。
还有Swing组件,Swing容器,Swing菜单以及AWT控件设计工具。
在面板下方有"
Design"
和"
Source"
两个页签,用来切换设计界面和Java源代码视图。
图中2是VE的工具栏,包括工具面板中的一些常用按钮。
图中3是"
JavaBeans"
视图和"
属性"
视图,两个视图可以切换显示。
"
视图用树形结构即时显示设计中用到的各种JavaBean组件层次。
而"
视图显示显示当前所选中的Javabean组件的属性值列表,你可以在此列表中编辑各项JavaBean的属性值。
图中灰色矩形区域即是我们最开始选择的JPanel,所有的工作就从它开始。
摆设Swing组件
做过SwingGUI界面设计的人都知道,Java应用程序界面上的元素位置是用LayoutManager来管理的。
JPanel的预设布局管理器是FlowLayout。
VE目前支持所有的传统的布局管理器(这里所指的传统布局管理器是指JDK1.4之前的布局管理器。
可惜的是VE目前还不支持从JDK1.4开始有的SpringLayout)。
要设置JPanel的layout,请先在设计界面中选中JPanel,再切换到"
视图,找到"
layout"
属性,如下图所示:
图中显示了JPanel的预设LayoutManager。
在"
属性的右边,可以通过点击组合框来指定不同类型的LayoutManager。
不同的LayoutManager会在属性编辑器中显示不同的参数,如果选择GridLayout,属性编辑器中的layout属性将显示另外几种不同的参数,如下图如示:
先前的FlowLayout的三个参数alignment,horizontalgap和verticalgap变成了GridLayout的另外四种参数:
columns,horizontalgap,rows,verticalgap。
为了方便设计,笔者在这个例子中将采用null,即不用任何LayoutManager来设计界面。
布局设置好后,就可以在JPanel上摆置各种Swing组件了。
按照我们最开始设计的草图,界面上要摆上四个Label:
From,To,Subject,Message。
以及四个文本组件,其第四个应该是TextArea,用于编辑多行文本。
我们在工具面板上选好相关组件,然后在JPanel上拖选出一个矩形,组件即按相应大小和位置显示在此矩形区域。
再在"
视图中编辑每个JLabel和JButton的"
text"
属性为相应的值。
现在来看看下面笔者"
画"
出来的界面:
看看,设计的如何?
笔者不是画家,"
出来的界面显得有些凌乱。
没关系,VE也提供一些工具按钮来让我们调整各个组件的位置。
请点击VE工具栏上的"
Showalignmentwindow"
按钮:
显示如下图的视窗:
通过此视窗,可以将所选组件向上下左右各个方向对齐。
还可以使所选组件具有相同高度和宽度。
来看看下图经过调整位置后的界面布局:
现在看起来是不是美观多了?
添加事件处理
经过前面的步骤,VE的可视化设计的任务就基本上完成了。
在我们设计的界面中,有"
Send"
Clear"
按钮。
我们再来看看VE是如何为它们添加事件处理的。
在设计界面的"
按钮上点击鼠标右键,弹出菜单,如下图:
在"
Event"
菜单项中,可以看到一个"
actionPerformed"
事件。
如果要添加其它类型的事件,可以点击"
AddEvents"
选择其它类型的事件。
我们点击"
事件后,在"
视图的"
jButton-"
组件下面,多了一个"
事件类型,如下图所示:
视图中,选中"
事件,再VE的窗口中,从"
切换到"
视图。
在上图标记1的代码区域,就是我们刚刚添加的按钮事件。
笔者在事件中调用了一个send方法,如图中标记2代码区域。
具体的发送邮件的代码笔者在这里就不实现了。
同样的方法,一样可以为另一个按钮"
添加事件。
在程序中使用自定义的组件
在前面我们设计好了自己的Java组件,现在我们来看看如何在自己的程序中――一个窗口中来调用这个组件。
使用前面介绍的方法,在工具栏上点击"
按钮,建立一个JFrame的VisualClass类。
你也可以在通过菜单"
->
来寻一个JFrame类。
在这里,我们将这个类命名为"
MyApp"
当VE窗口出现时,可以看到一个空白的JFrame显示在设计视图中。
此时,点击VE的工具面板上的"
ChooseBean"
按钮,然后在弹出的对话框中输入我们设计的Java组件的类名"
MessagePane"
,再点击"
确定"
这时,当我们的鼠标移到JFrame上时,JFrame会用绿色的线条切分成五份,如下图所示:
这是因为JFrame的预设LayoutManager是BorderLayout,在VE中,如果在工具面板上选好Java组件,当鼠标移到有特定LayoutManager的容器组件上时(在上图中容器组件是一个JFrame),VE会用适当的形式指示你当前鼠标悬停的位置。
在上图在VE告诉我们现在处在BorderLayout的中心位置,此时再在该位置点击一次,我们选好的Java组件即安放到此位置。
用VE设计好程序界面,就可以切换到"
视图进行具体的代码的编码了。
在此我们就不累述了。
定制VE的环境
之前的讲解,大家学到了如何用VE来进行可视化的Java界面设计。
为了适应不同的开发者,VE也提供了一些选项来让开发者设计自己喜好的VE环境。
请打开菜单"
窗口"
首选项"
Java"
VisualEditor"
,此时出现VE的各种首选项界面。
由于笔者安装的eclipse中文语言包早于VE发布,所以此界面仍然是英文界面。
在这里,VE的首选项分为三类:
Appearance"
,"
CodeGeneration"
PatternStyle"
下面结合图形分别介绍:
1.外观(Appearance)设置:
此面板中可以设置这此内容:
(1)设置可视编辑器和源代码编辑器的布局,一种是上下分隔的布局,另一种是用页答进行切换的布局(即本文例图中所见到的样式)。
(2)设置是否显示"
(3)设置设计时Swing的界面风格。
2.代码生成(CodeGeneration)设置
此面板包括以下内容:
(1)设置是否为新表达式生成注释和try{}…catch()块。
(2)设置可视设计界面和代码编辑器之间的代码同步时间。
3.代码模板风格(PatternStyle)设置
(1)VE所用的存取JavaBean的代码风格。
(2)VE初始化时尝试使用的初始化方法。
VE目前已提供了对Jbuilder、NetBean等其它IDE产品可视编辑器生成的Java组件代码初始化方式的支持。
总结
行文至此,我们从VE的安装到Java组件设计以及VE环境的设置,基本上已对eclipse的全新工具VisualEditor作了一个全面的了解。
有了VisualEditor,我们所有的开发工作,从图形用户界面到业务逻辑,全部可以在eclipse平台上完成。
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- Eclipse 进行 可视化 JAVA 界面设计
![提示](https://static.bdocx.com/images/bang_tan.gif)