IBM®
跳转到主要内容
    中国 [选择]    使用条款
 
 
Select a scope:Search for:    
    首页    产品    服务与解决方案     支持与下载    个性化服务    
跳转到主要内容

developerWorks 中国  >  WebSphere  >

WebSphere Studio Application Developer 与 VisualAge for Java 之比较: 第 3 部分:使用新的 Visual Editor

developerWorks
文档选项

未显示需要 JavaScript 的文档选项


级别: 初级

Joe Winchester, WebSphere 工具开发人员, IBM 赫斯利(Hursley)实验室,联合王国
Dr. Gili Mendel, WebSphere 工具开发人员, IBM 罗利(Raleigh)实验室,北卡罗来纳州
Rich Kulp, WebSphere 工具开发人员, IBM 罗利(Raleigh)实验室,北卡罗来纳州
Peter Walker, WebSphere 工具开发人员, IBM 罗利(Raleigh)实验室,北卡罗来纳州
Rolf Kalim, WebSphere 工具开发人员, IBM 罗利(Raleigh)实验室,北卡罗来纳州

2002 年 12 月 01 日

WebSphere Studio Application Developer 版本 5.0 引入了 Visual Editor,它使开发者可以根据 JavaBeans 组件模型构建图形用户界面。Visual Editor 提供了一个选用板(palette),这个选用板让您选择 AWT 或 Swing 提供的 Java bean;当然您也可以添加和使用自己的控件。

© Copyright International Business Machines Corporation 2002. All rights reserved.

引言

WebSphere® Studio Application Developer 版本 5.0(以下称为 Application Developer)引入了 Visual Editor,它使开发者可以根据 JavaBeans™ 组件模型构建图形用户界面。Visual Editor 提供了一个选用板(palette),它让您从 Abstract Widget Toolkit(AWT)或 Swing 选择 Java bean;当然您也可以添加和使用自己的控件。本文描述了 Visual Editor 的功能,并且就其应用将 Visual Editor 与其前身 Visual Composition Editor(可从 VisualAge® for Java 获得)进行了比较。

这两个编辑器间的主要区别之一在于 Java bean 与生成的 Java 源代码一起运行的方式。早期的 Visual Composition Editor 让您放置 Java bean 并使用属性页或定制器(customizer)修改它们,然后在每次保存文件时重新生成源代码。您只可以在预定义的用户代码部分修改源代码,或者通过添加新方法来修改源代码。源代码修改并不反映回 Java bean 中;Visual Composition Editor 是一个自顶向下的(top-down)开发工具,它可以根据 Java bean 生成源代码,但反过来不可以。相比之下,新的 WebSphere Studio Visual Editor 可以执行更改在 Java bean 与源代码之间的双向传递(round-tripping)。您可以修改 Java bean 并且会看到修改反映到了源代码中,您也可以更改源代码并且会看到更改被应用到了 Java bean 中。Visual Editor 是一个以代码为中心的编辑器,它不仅支持更改的双向传递,还使用分割开的窗格并排显示 Java bean 和源代码。当您选择 Java bean 时,源代码显示初始化该 Java bean 的方法,当您选择个别属性时,您可以看到设置该属性的值的语句。

这两个编辑器间的另一个不同之处在于创建事件处理逻辑的方法。在早期的 Visual Composition Editor 中,您可以建立 Java bean 间的连接;添加侦听器并执行适当的回调逻辑的代码在代码生成期间被创建。除事件到方法(event-to-method)的连接外,Visual Composition Editor 还支持更高级的程序构造,比如属性到属性(property-to-property)的连接。虽然一些Visual Composition Editor 用户喜欢编程时使用连接,而其他人却感到很麻烦,因为必须在拥有大量连接的程序内维护和调试类,这种工作很复杂。相比之下,要使用新的 Visual Editor 添加事件处理程序逻辑,您可以直接在源代码本身中编写事件处理逻辑。





回页首


启动 Visual Editor

为演示 Visual Editor 的功能,我们将创建一个名为 MyPanel 的 Java 类,这个类是 javax.swing.JPanel 的子类。

请单击位于 Java and Java Browsing 透视图工具栏的 Create Class 向导按钮  Create Class 向导图标的抓屏或者先从菜单选择 File => New,然后选择 Class来创建一个 Java 类。现在,标准的 Java Editor 被打开,显示源文件的内容。

要启动 Visual Editor,您必须先关闭 Java Editor,然后右键单击这个新文件。从下拉菜单选择 Open With => Visual Editor


图 1.
在 MyPanel 类上选择 Open With => Visual Editor

Java 文件的缺省编辑器(也就是当您在包资源管理器视图中创建或双击一个文件时启动的编辑器)在可用编辑器列表中加黑点标出。如果您想让 Visual Editor 成为所有 Java 文件的缺省编辑器,那么您可以进行如下的全局修改:先选择 Window=> Preferences启动 Preferences 对话框,然后选择 Workbench => File Associations





回页首


了解 Visual Editor 的外观和感觉

Visual Editor 由多个窗格组成(请参见图 2)。顶端部分有一个图形画布,其源文件显示在它的下方。左边显示一个公共 Java bean 选用板,各个区域之间都用拆分条分开,您可以选择这些拆分条并把它们移到新的位置,所以您可以腾出最大的可用空间。


图 2.
WebSphere Studio Visual Editor 抓屏

Visual Editor 启动后,另外两个窗格自动打开:Java Beans 窗格(它用树视图显示 Java bean 的结构)和 Properties 窗格(它让您查看和修改属性设置)。Java Beans 窗格很象早期 VisualAge for Java Visual Composition Editor 中的 Beans List。

Visual Editor 底部的源代码窗格可以说是 Application Developer 附带的标准 Java Editor 的嵌入版。在这里,您可以在源代码中设置断点、使用内容帮助并利用 Java Editor 提供的其他功能。

当您在 Visual Editor 的画布中、Properties 窗格中或者 Java Beans 窗格中修改代码时,这些修改会在源代码中被自动更新;您不需要显式生成代码。您可以单击工具栏中的 Undo 按钮 Visual Editor 工具栏中 Undo 图标的抓屏撤销任何修改。除修改 Java bean 外,您还可以直接修改源代码,并且会看到这些修改被反映到了 Java bean 中。这就使您能够更改 Java bean,然后让更改反映到源代码中,反过来也可以。

相比之下,VisualAge for Java 中的 Visual Composition Editor 主要是一个自顶向下的开发工具,在这个工具中,对 Java bean 所做的更改会生成到源代码中,但这个过程反过来行不通。因为 Java 源代码总是从 Java bean 重新创建的,所以用户修改就被限制到只能在新方法中或者在源代码中预定义的部分(用 //user code 注释界定的部分)进行。





回页首


使用 Java bean 属性

当在 .java 文件上打开 Visual Editor 时,它解析源代码以查找 Java bean 是否存在。因为先前创建的 MyPanel 类是 javax.swing.JPanel 的子类,所以还有一个 Java bean 被创建,用来代表类本身的实例。新 Java bean 被命名为 this ,在 Java Beans 窗格和画布中显示。如果类的可设置属性是复合的,则 Visual Editor 只创建一个 this bean。任何作为 java.awt.Component 的派生的 Java bean 都以图形化的运行时表示显示在画布中,所以 MyPanel(它在自己的超类列表中包含 java.awt.Component)显示为一个灰色的面板。目前还没有为 MyPanel 设置大小,所以它仍以缺省大小显示在画布中。缺省大小是调用 getPreferredSize() 的结果,对于没有组件的空 JPanel 来说,其缺省大小是 10,10

画布允许您选择 Java bean;使用鼠标来移动它们、调整它们的大小。要使 JPanel 更大一些,请把光标移到 JPanel 的右下角,这样光标就变成了东南指向的箭头 东南指向箭头的抓屏,然后左键单击并把光标移到期望的大小,然后再释放鼠标:


图 3.
显示被放在 Visual Editor 画布中的 JPanel Java bean 的抓屏

当调整 JPanel 的大小时,源代码就会被更新以包含设置新大小的代码行。这是 initialize() 方法内的 setSize(157,112) 语句,该方法是从 MyPanel 构造函数调用的。调整过大小后,源代码逐渐更新;您不必为刷新代码而显式重新生成代码。Properties 窗格还会在 size 属性旁边显示一个右箭头 > 用来指出这是已经在代码中显式设置的值。调用与属性关联的 get 方法,属性就会(不带右箭头 > )以在 Java bean 中的缺省值出现。除使用面板上的调整大小句柄以可视的方式更改 size 属性外,您还可以选择 Properties 窗格中的 Value列,并在那里编辑它。可以通过直接往 Properties 窗格中输入新值并按下 Enter来更改 size 属性。如果输入的值无效,那么就会在这个编辑器底部的状态栏中显示一条错误消息。


图 4.
输入的值无效时在状态栏中显示的错误消息的抓屏

有些属性具有有限的枚举值集;在这些情况下,您不必更改 Properties 窗格的文本域中的值。


图 5.
下拉域值的抓屏

其他属性,比如 font、color 和 icon 有额外的对话框编辑器,您可以从 Properties 视图启动它们。这些编辑器将打开一个让您指定新值的单独的窗口。

有些属性,例如上面显示的布局属性的 FlowLayout 值本身就是 Java bean。您可以展开这些 bean 来查看和修改它们的属性。如果嵌套的属性是包含更多属性的 Java bean,那么您可以展开该列表,进一步深入到包含特定属性值的属性(请参见图 6)。


图 6.
属性列表的抓屏

上图显示的 Java bean Properties 列表包含具有 get 和 set 方法的属性,因此是读和写属性。通过使用菜单,您可以把 Properties 窗格配置为还显示只读属性。


图 7.
 Properties 列表的抓屏

选择菜单上的 Show null values可以区分值为空的属性和空值属性。例如,面板的 name 属性可以是一个空字符串或者一个未定义的字符串。在 Properties 窗格中设置 Show null values使您可以区分这两者;值 <null> 显示在值为空的属性的旁边。


图 8.
值 null 出现在值为空的属性旁边的抓屏

如果您想把一个属性设置为 null,请单击工具栏中的 Set to null 按钮 工具栏中的 Set to null 按钮的抓屏。如果您想把一个属性的值重设为其初始的缺省值,请单击工具栏中的 Reset property value 按钮  工具栏中的 Reset property value 按钮的抓屏

因为 Visual Editor 支持源代码的双向传递,所以您还可以通过直接更改源代码值来修改属性值。 Java 源代码的双向传递部分讨论了这一点。





回页首


添加新的 Java bean

除使用 this Javabean(它代表被创建类的实例)外,您还可以用选用板添加新的 Java bean。选用板位于 Visual Editor 的左边,工具栏中也有。 Choose Bean按钮 Choose Bean 按钮的抓屏打开一个对话框,该对话框允许您选择任何 Java bean,而它旁边的向下箭头打开一个包含常见 Java bean 种类的菜单(请参见图 9):


图 9.
显示 Java bean 种类下拉菜单的抓图

要把一个新 Java bean 放在画布上,请从选用板中选择它并将其移到您希望的目的地。您可以把这个 Java bean 放在能够接受子 Java bean 的 Java bean 的顶部,也可以将其作为新的顶层 Java bean 放置。您还可以把 Java bean 放在 Java Beans 窗格上。当您选择一个选用板项(例如 JButton)时,状态栏标签就会被更新,指出哪个 Java bean 被选中了:


图 10.
显示状态栏标签被更新指出 JButton Java bean 已经被选中的抓屏

光标也会改变 指出现在正处于创建模式的光标的抓屏,指出您现在正处于创建模式。

Java bean,比如 JPanel,可以接受代表它们的组件的子 Java bean。如果您把鼠标移到 MyPanel 的 this Java bean 上然后释放它,那么将添加 JButton Java bean。现在,这个按钮显示在了画布上:


图 11.
显示 JButton Java bean 被显示在画布上的抓屏

要设置该按钮的属性,比如 text,请选择该按钮并查看其列在 Properties 窗格中的属性。当您向一个容器(比如 JPanel)添加 Java bean 时,该 Java bean 的位置和大小由容器的布局管理器来决定。容器把布局管理器类作为一个代表用来确定其组件的外观,通常在 Java bean 的运行时大小或它的任意“用户可见的字符串”改变时使用。JPanel 的缺省布局管理器是 java.awt.FlowLayout 类,这个类给每个组件赋予它的首选大小,并将它们从左到右展开。因为容器的布局管理器负责容器组件的位置,所以您不能精确控制每个 Java bean 的位置。要明白这一点,请从选用板选择另一个 Java bean(例如,JScrollBar)。当您将鼠标移到 JPanel 上时,将会看到在现有 JButton 的一边(可以是左边也可以是右边)画出了一条垂直线。这是 Visual Editor 中的目标反馈。它让您知道将在相对于现有 Java bean 的哪个位置添加新的 Java bean:


图 12.

请先按下然后释放鼠标左键来放置 JScrollBar Java bean。现在新的 Java bean 被放在了 JButton 前面 FlowLayout 的旁边。这两个组件以它们的首选大小被显示,并被平均地放在了可用宽度上:


图 13.

如果有一个布局管理器,比如 java.awt.FlowLayout,您就可以让 GUI 在运行时对影响其外观的更改作出反应。这些更改可以包括因字体或依赖语言的标签的不同或者因用户把窗口的大小调得更小或更大而引起的组件首选大小的更改。如果这些更改在运行时发生,并且发生这些更改的环境可能与您构建应用程序的环境不同,那么布局管理器将从当前值把 GUI 组件设置回它的首选大小和窗口区域。

您构建的一些应用程序可能只被部署在一种语言环境中。标签字符串是硬编码的,当窗口大小被调整时您可能不在乎组件的回流(reflowing)。在这种情况下,您可以通过把布局管理器设置为空获得比使用布局管理器时对组件的位置和大小更大的控制权。要这样做的话,请先选择 Properties 窗格内的面板,然后从布局属性内的可用值列表中选择 null


图 14.

由于面板的布局管理器不再负责其组件的大小和位置,那么现在您必须在源代码中显式设置组件的大小和位置。当您设置面板以获得空布局时,Visual Editor 设置每个组件的现有大小和位置并将这些作为它们的 bounds 属性。使用组件的 bounds 属性可以方便地在单个长方形内把大小和位置属性组合在一起。在视觉上,您会看到画布上的 Java bean 并没发生什么变化,因为它们的大小和位置相对于面板并没有改变,但代码却被更新为包含设置组件的 bounds 属性的方法调用:

private javax.swing.JScrollBar getIvjJScrollBar() {
   if(ivjJScrollBar == null) {
      ivjJScrollBar = new javax.swing.JScrollBar();
      
          ivjJScrollBar.setBounds(50, 5, 17, 61);
   }
   return ivjJScrollBar;
}
        
        

对于其容器没有布局管理器的组件,请使用 Alignment 对话框设置其大小和位置。请通过单击工具栏上的 Alignment 对话框按钮  打开对齐对话框按钮的抓屏打开该对话框。Alignment 对话框包含一组按钮,这些按钮使您能够更改被选中的 Java bean 的大小和/或位置。当您使用对齐操作时,您通常会选择许多 Java bean,其中一个被称为锚点(anchor)。锚点是最后被选中的 Java bean;它形成移动或调整其他控件大小的规则。对齐类型取决于所用的操作,但选择 Align Bottom 会通过更改每个 Java bean 的 y 坐标使它们的底边缘(bottom edge)与锚点相同。


图 15.
选择 Align bottom 按钮

除对齐 Java bean 的边缘之外,您还可以用 Match Width  Match Width 按钮的抓屏和 Match Height  Match Height 按钮的抓屏按钮使它们的大小对齐。Distribute 操作让您在 Java bean 的父容器内或在由 bounding box  bounding box 图标的抓屏定义的一个明显的区域内用平均的距离隔开选中的 Java bean。请为其容器没有布局管理器的组件以及没有容器并且直接位于画布上的 Java bean 使用 Align 和 Distribute 按钮。

当 FlowLayout 作为容器的布局管理器时,它的组件 ? JButton 和 JScrollBar ? 并不在 Properties 窗格内显示 bounds、location 和 size 属性。即便设置了属性也不会起什么作用,因为它们的大小和位置由 FlowLayout 实例决定,而不是由个别组件决定。如果没有布局管理器,就在 Properties 窗格提供每个组件的 bounds、location 和 size 属性,并且可以用属性编辑器修改这些属性。因为每个组件的大小都被指定了精确的坐标,所以您可以用它在画布中的句柄移动和放置它。当您向一个布局管理器被设置为空的容器添加新的 Java bean 时,您还可以确定您要放置组件的精确位置。如果您在把 bean 放在画布上时没有为其指定大小,那么它的大小将被显式设置为该组件的首选大小。

java.awt.FlowLayout 类根据每个组件的首选大小确定其大小,并将它们从左向右展开。这是无约束布局管理器的一个实例,并实现了接口 java.awt.LayoutManager。Java 语言包含接口 java.awt.LayoutManager2;这使得每个组件在确定自己的大小和位置时都可以指定布局管理器应该使用的额外数据。实现 java.awt.LayoutManager2 的布局管理器的一个示例是类 java.awt.BorderLayout。BorderLayout 类把容器分为四个边缘区域 North、East、South、West 和一个中间区域(Center)。您可以为每个组件指定放置它的区域。边缘区域被指定后,它就根据自己的首选大小占据整个边缘地带和其余的轴线部分。中间区域被指定后,组件就占据容器的全部剩余可用空间。

要为容器使用 BorderLayout 类,请从可用布局属性列表中选择它。每个组件的 bounds、location 和 size 属性都被从 Properties 窗格中除去,并且为容器内每个现有的组件生成缺省的约束。对于我们的示例,这意味着 JScrollBar 被放在 North 区域,JButton 被放在 East 区域。如果当容器向 BorderLayout 切换时容器内有五个以上的组件,那么多出来的组件将被删除。


图 16.
显示多余组件被删除的抓屏

Properties 窗格显示父容器布局管理器实现 java.awt.LayoutManager2 的组件的约束属性。约束属性编辑器随布局管理器的不同而异;对于 BorderLayout,下拉菜单列出了可用的约束区域。当您把一个新 Java bean 放在面板顶部时,您将看到五个约束区域。已经被占用的区域(比如下面示例中的 North 区域和 East)用暗灰色显示。您无法把新的 Java bean 放在这些区域中。用光标突出显示的当前区域用它的名称标出,在这个案例中,其名称是 West:


图 17.
显示突出显示区域的抓屏,该区域用其名称(在本例中是 West)标识

除支持 FlowLayout 和 BorderLayout 布局管理器外,Visual Editor 还支持 CardLayout、GridLayout、BoxLayout 和 GridBagLayout。java.awt.GridBagLayout 这个类是布局管理器功能最强大的类;它把容器分为一系列行和列,并让您指定应该放置组件的单元、如何把它锚定在那里以及它应该占用多少个单元。

在使用 GridBagLayout 时,新 Java bean 是用约束创建的,该约束是用 GridBagConstraints 的空构造函数创建的一个 GridBagConstraints 实例。尽管面板根据现有的列来显示结果,但新组件总是被添加到末尾处(您把组件放在哪里都没关系)。相比之下,早期的 VisualAge for Java Visual Composition Editor 根据它在画布上放置 Java bean 的位置(也就是鼠标的位置) 生成一个约束。

因为缺省的约束一直被 GridBagLayout 占用,所以您必须通过使用 Properties 窗格或者直接编辑源代码为组件修改 GridBagConstraints 对象的值。


图 18.
显示怎样通过直接编辑源代码来为组件修改 GridBagConstraints 对象值的抓屏

有一种很适合 GridBagLayout 的技术,这种技术把 GridBagLayout 放在精确的位置上、设置每个组件的大小而不必在容器上设置布局管理器(也就是把布局管理器设置为空)。当 GUI 完成时,将 GridBagLayout 设置为布局管理器。现在,Visual Editor 根据其当前的 bounds 属性为每个组件生成约束;这导致每个组件都有相同的位置和大小,只不过它们不再使用显式的 bounds 属性,而是使用 GridBagConstraints 对象。使用 GridBagLayout 作为布局管理器而不把布局管理器设置为空的好处是,当用户在运行时调整窗口的大小时,组件将被展开以充分利用可用空间。同样,如果因为运行时字体或语言环境的不同而使组件内的可见字符串(比如按钮或标签)发生了变化,那么在使用 GridBagLayout 时 GUI 将进行适当的调整。当布局为空和具有显式 bounds 时(这时每个组件都有固定的运行时位置和大小)这种情况将不会发生。





回页首


添加定制的 Java bean

除从选用板中定义的常用类列表中选择 Java beans 外,您还可以选择 Choose Bean选项向您创建的类添加任意 Java bean:


图 19.
选中了 Choose Bean 选项的抓屏

选择 Choose Bean;一个对话框被打开,并显示一张可用类列表 (请参见图 20)。除非您要选的类与您准备在其中使用 Java bean 的类在同一个包中,否则只能选择公共类。该类应该有一个公共的空构造函数作为显式方法或作为隐式的缺省构造函数。


图 20.
Choose a Bean 对话框的抓屏

如果愿意的话,您可以在 Choose a Bean 对话框顶部的 Class 域中输入一个搜索字符串。您还可以使用 Swing 和 AWT 单选按钮来进一步限制类列表。

我们可以通过使用被创建的类的项目的 Java Build Path 来决定 Choose a Bean 对话框中的类列表。如果您想包含自己不在当前项目中的 Java bean,请为该项目打开 Properties 对话框并确保您的 Java bean 的位置被包含在构建路径中。修改过 Java Build Path 后,您需要先关闭 Visual Editor,然后重新打开它以便让更改生效。

当 Visual Editor 打开后,一个 VM 被创建,它被用于托管 Java bean 实例。VM 类路径是由项目的 Java Build Path 中的条目决定的,所以如果您更改了构建路径的 JRE,那么您同时也更改了 Visual Editor 将使用的 JRE。要看到这一点,请先选择 Window => Preferences,然后选择 Java => Installed JREs在 Application Developer 中定义一些新的 JRE。然后,单击 Add。这样您就可以指定 JRE 的位置。您可以让任意 JRE 成为 Preferences 对话框中的缺省 JRE;现在 Visual Editor 将使用这个 JRE 来启动其 VM。完成这些操作后,您就可以使用另一个 JRE,比如 JDK 1.4;然后您可以从 Choose a Bean 对话框选择它的新 Java bean,比如 javax.swing.JSpinner。

能够使用可插 JRE 是 Visual Editor 的一种强大功能。相比之下,早期的 Visual Composition Editor 使用内建在 VisualAge for Java 中的修订过的 JDK 级别。

除在 Application Developer 中更改缺省的 JRE 外,您还可以基于每项目覆盖 JRE。为此,您需要从项目的构建路径中除去现有的缺省 JRE,然后添加新的 JRE。要向构建路径添加新的 JRE,请按 Libraries 页面上的 Advanced按钮,然后选择 Add Container => JRE System Library。这样会出现一列大家都知道的 JRE 供您选择。但由于 Visual Editor 定位它的一些内部类的方法的缘故,变量条目 JRE_LIB 必须出现在 Java 项目的构建路径中。因此,您不应该从构建路径中除去 JRE_LIB ,而是应该保留它,并确保在构建路径中把新容器放在它的前面。

当 Visual Editor 启动它的 VM 来运行其 Java bean 时,您无法重新装入对正使用的类所做的更改。例如,如果您正在使用一个定制的面板,同时还对它进行了修改,那么由于 Visual Editor 正在使用这个定制的面板,在关闭并重新打开该编辑器之前,它将不反映这些更改。相比之下,VisualAge for Java Visual Composition Editor 能够动态显示被更改类的结果而不需重新打开该编辑器。





回页首


从 Java 源代码到 Java bean 的双向传递

目前为止所用的示例已经演示了如何在 Visual Editor 的其中一个窗格内对 Java bean 进行更改,更改后源代码将被适当地修改。除通过窗格进行更改外,Visual Editor 还允许您直接修改源代码。例如,如果您想把 JButton 的背景色设置为 cyan ,您可以打开该编辑器在 Properties 窗格内的 background 属性,或者也可以直接向源代码添加代码行:

private javax.swing.JButton getIvjJButton() { 
   if(ivjJButton == null) { 
      ivjJButton = new javax.swing.JButton();    
      
        ivjJButton.setBackground(java.awt.Color.cyan);    
   }
   return ivjJButton;
}
    
      

当您已经在代码中添加了设置按钮背景色的方法调用后,Java bean 将被刷新,画布将用该按钮的新颜色显示它。对 Java 源代码所做的更改会自动在 Java bean 中得到更新;您不必显式刷新该 Java bean。

Visual Editor 是一个以代码为中心的编辑器。为帮助您在画布或 Java Beans 窗格内选择 Java bean 时浏览代码,负责设置 Java bean 初始属性的方法在源代码中被突出显示。您还可以通过在 Properties 窗格内选择属性来直接到达负责设置该属性的值的代码行。

Visual Editor 能够处理对源代码进行的直接更改,然后,当 Java bean 在不同的窗格内被更改时源代码会得到更新,这个过程反过来也可以。这被称为双向传递( round-tripping)。相比之下,VisualAge for Java Visual Composition Editor 只允许您在窗格内对 Java bean 进行更改;然后它重新生成源代码,并把 Java bean 序列化到资源库内作为元数据。而 Visual Editor 却没有元数据。每当 Visual Editor 被打开时,它都会解析并分析源代码以确定其窗格所用的 Java bean 模型。这意味着您可以在另一个编辑器内编辑 Java 源代码,然后在 Visual Editor 中重新打开它就可以看到您做出的更改。当 Visual Editor 被打开时,它“侦听”对其 Java 源文件内容所做的更改,然后以增量的方式刷新其 Java bean,即便源代码是在另一个 Java 编辑器内被修改也是这样。

在您修改过源代码后,后台同步器(background synchronizer)观察到发生的更改,然后更新 Visual Editor 使用的 Java bean。编辑器底部的状态栏显示 Java bean 和源代码之间的同步状态。状态 In Sync表示两者是同步的,状态 Out of sync表示已经发生了更改但有一个已排好队的暂挂更新, Synchronizing表示正在进行更新。有两个箭头被更新以显示正执行的更新的方向:向下的箭头表示从 Java bean 到源代码的更改,而向上的箭头表示从源代码到 Java bean 的更改。尽管源代码和 Java bean 之间自底向上的同步运行在后台,并且更改代码时不会降低性能,您也可能想在对代码进行实质性的更改时暂挂进程。您可以通过单击状态栏中的 Pause按钮 pause 按钮图标的抓屏来实现这一点;然后这个按钮变成一个绿色的 Resume箭头。请按 Resume按钮重新启动同步器。为避免当同步器暂停时发生顺从(reconciliation)问题,在窗格内对 Java bean 所做的所有更改都被忽略,您应该只更改源代码。当同步器恢复后,对源文件的全部内容进行分析以刷新 Java bean,所以使用 PauseResume将会是一种从源代码重新装入到 Java bean 的有效方式。


图 21.
Pause 按钮和 Resume 按钮的抓屏

为从源代码成功更新 Java bean,您必须利用已被承认的模式。这些模式的基础是早期的 Visual Composition Editor 生成的代码模式,这些代码模式使用户可以很容易地向 WebSphere Studio 迁移。对于被看作 Java bean 的字段,在 get 方法中对其进行实例化。下面是一个典型的 Visual Editor 方法,它创建一个 JPanel,并且将被 Visual Editor 识别出来,因为这个字段是被 get 方法内的 ivjJPanel= new javax.swing.JPanel() 语句实例化的。

private javax.swing.JPanel ivjJPanel;
private javax.swing.JPanel getIvjJPanel() {
   if(ivjJPanel == null) {
      ivjJPanel = new javax.swing.JPanel();    
      ivjJPanel.setBackground(java.awt.Color.cyan);    
   } 
   return ivjJButton;
}
        

get 方法返回该字段,并且可以实例化多个 Java bean。

对于实例化 Java bean 的方法,在 catch 块外第一次出现的 set 方法被用作初始的属性值。在上面的方法(其中 ivjJPanel 被当作 Java bean)中,语句 ivjJPanel.setBackground(java.awt.Color.cyan) 被解析为背景色属性的初始化代码。被创建的类的属性的 set 方法必须在 applet 的名为 initialize() 或 init() 的方法中。

要把属性的值应用于活动的 Java bean 实例,set 方法的参数语法应该是一个全限定的、独立的初始化字符串,比如 java.awt.Color.cyan 。如果初始化字符串引用一个类,这个类不是全限定的,但包含在一条导入语句中,那么它可能无法求表达式的值,尽管对于公共字段和构造函数来说,它能够通过导入的内容解析该类。复杂的参数表达式,比如使用内部类的那些表达式无法被求值。这意味着您将不能看到 set 方法对活动的 Java bean 的影响,尽管您将接收到一条警告指出这已经发生了。初始化字符串无法被应用于活动的 Java bean,因为对于 Visual Editor 所用的求值引擎来说它们太复杂了。但您在编译和执行 .class 文件时将应用它。警告只是提醒您 GUI Java bean 在设计时可能是不完整的。


图 22.
显示一条警告的抓屏,这条警告指出 GUI Java bean 在设计时可能是不完整的




回页首


编写事件处理代码

您用 VisualAge for Java Visual Composition Editor 编写了在 Java bean 之间建立连接的程序逻辑。然后这些连接生成了适当的代码以将侦听器附加到源 Java bean,然后在目标 Java bean 上执行期望的操作。相比之下,新 Visual Editor 并不在 Java bean 间传递连接这个概念;这种程序逻辑是通过直接在编辑器内写代码指定的。为帮助开发者编写事件处理代码,Visual Editor 提供了几个内容帮助模板。

每个模板的名称都与预定要使用它的方法的名称相同。例如,向按钮添加操作侦听器的模板的名称是 addActionListener 。要使用该模板,请在画布或 Java Beans 窗格内为按钮选择 Java bean,Visual Editor 将选择初始化该 Java bean 的适当方法。在写了代码行的开头(例如 ivjJButton.addA )后,您就可以通过按键盘上的 Ctrl-Space来调用内容帮助。模板将出现在内容帮助列表的底部:


图 23.
显示出现在内容帮助列表底部的模板的抓屏

如果您选择内容帮助列表内的 addActionListener(ActionListener l)这一项,那么将添加调用该方法的代码。但如果您选择 addActionListener模板,就将添加调用该方法的代码以及将成为侦听器的匿名内部类代码。

Private javax.swing.JButton getIvjJButton() {
   if(ivjJButton == null) {
      ivjJButton = new javax.swing.JButton();
      ivjJButton.addActionListener(new java.awt.event.ActionListener() {
         public void actionPerformed(java.awt.event.ActionEvent e) {
         }
      });
   }
   return ivjJButton;
} 
        

使用了模板后,光标将被放在 actionPerformed() 方法内。然后您可以编写按下按钮后将执行的代码。

如果您想为之添加侦听器的事件的模板没有出现在可用代码帮助列表中,那么您可能能够将其导入到 Application Developer 中。Visual Editor 还提供了一些额外的模板,这些模板位于目录 /plugins/com.ibm.etools.jbcf.codegen_5.0.0/Examples/Templates 中。内容帮助模板可以作为单独的文件供公共 AWT 和 SwingJava bean 使用,或者您也可以通过在一个目录中选择 AllTemplates.xml 文件把所有的模板导入到一个目录中。要导入这些模板,请从菜单选择 Window => Preferences,然后选择 Java => Templates启动 Preferences 对话框。单击 Import 按钮打开一个文件浏览器,然后转到包含模板文件的目录。





回页首


测试 Java bean

要执行您的 Java bean 并查看其运行时行为,您需要编写一个带 public static void main(String[] args) 方法的类,该方法实例化 Java bean 并使其可见。如果这个 Java bean 不是顶层窗口,而是,例如一个面板,那么您需要创建一个框架把这个面板放进去。如果这个类是一个 applet,那么您需要编写一个 HTML 文件来测试该 applet。

Visual Editor 包含一个 Java Bean 快速启动板(launcher),您不必编写 main(String[] args) 方法就可以使用这个快速启动板。请从菜单选择 Run => Run As => Java Bean或者单击工具栏中的下拉按钮来打开 Java Bean 快速启动板:


图 24.
从菜单选择 Run => Run As => Java Bean 来启动 Java Bean 快速启动板

Java Bean 快速启动板用缺省的构造函数实例化被选中的类,如果您需要的话,它还将创建一个 Frame 或 JFrame 把这个类放进去。当您使用 Java Bean 快速启动板时,您将为被测试的类创建一个配置。请选择 Run => Run来编辑配置属性、删除和创建新配置。


图 25.
Create, manage, and run launch configurations 对话框的抓屏

如果您正在测试的类继承了 java.awt.Applet 或 javax.swing.JApplet,那么请到 launch configuration 的 Applet Parameters选项卡视图指定其参数;它将在 applet 查看器内被启动。其他的选项卡视图让您指定 VM 参数、类路径信息等等。除使用 Java Bean 快速启动板运行 Java bean 外,您还可以选择 Debug => Debug As => Java Bean用调试器运行 Java bean。当然,您可以在调试器中设置断点来停止代码并分析其行为。

相比之下,在 VisualAge for Java 中,您无法测试 Java bean,并且只能通过 public static void main(String[]) 方法执行 Java bean。Visual Composition Editor 可以生成 main(String[] args) 方法的缺省实现来帮助测试 Java bean。但缺点是在应用程序中,您通常希望只启动几个类。让每个 Java bean 都实现 main(String[] args) 方法会大大增加运行时类文件的大小,而这是不必要的。





回页首


从 VisualAge for Java 向别处迁移

由于新的 Visual Editor 直接读、写源代码,并且没有额外的元数据文件与之相关联,所以您可以打开用 Visual Composition Editor 创建的 Java 文件,并且可以在 Visual Editor 中马上开始使用它。不需要执行正式的迁移步骤;但您可以选择在 VisualAge for Java 内运行 迁移实用程序来帮助您在将其导入到 Application Developer 前准备源代码。迁移实用程序可以除去不再需要的注释,并且它还可以捕获顶层 Java bean 在自由格式面板上的位置。请注意:这些步骤是可选的,所以,即便不运行迁移实用程序,您也可以从 VisualAge for Java 导出自己的源代码,将这些代码导入到 Application Developer,然后用 Visual Editor 打开 Java 文件继续编辑。

迁移实用程序被用于捕获顶层 Java bean 在自由格式面板上的位置,因为这个位置是设计时数据,不在源代码中出现。在早期的 VisualAge for Java Visual Composition Editor 中,如果您移动顶层 Java bean 并重新生成它,源代码将不改变。位置信息存储在元数据中,这些元数据被用来序列化 Visual Composition Editor 的 Java bean。新的 Visual Editor 中没有元数据,所有的数据必须存储在 Java 源文件中,所以顶层 Java bean 在画布上的位置被存储在每个字段旁边的注释中,比如:

private javax.swing.JButton ivjJButton = null;    
          // @jve:visual-info decl-index=0 visual-constraint="205,26"
        
        

这些注释是可选的;如果没有注释,Visual Editor 将把这些 Java bean 的位置设为缺省位置。它只用于直接位于画布上的 Java bean,所以作为容器的子容器的组件并不需要位置方面的注释,因为从实际的源代码语句中就可以捕获它的位置信息。Visual Age for Java 中的迁移实用程序将以 Visual Editor 可以识别的注释格式写顶层 Java bean 的位置,所以,在把源代码迁移到 Application Developer 并在 Visual Editor 中打开后,所有的非可视 Java bean 及顶层的可视 Java bean 都将被放在与它们在 Visual Composition Editor 中相同的位置。





回页首


结束语

新的 WebSphere Studio Visual Editor 提供了几个与早期的 VisualAge for Java Visual Composition Editor 所提供的功能相似的功能。本文介绍了 Visual Editor 的基础知识并讨论了如何使用各种窗格处理 Java bean。要构建功能齐全的应用程序 GUI,您需要对每个 AWT 或 Swing 组件有更深入的了解,并且要知道如何在 Visual Editor 内应用最佳实践。将来的文章和教程将更深入地介绍这些方面并提供不同的案例帮助您使用 Visual Editor 快速而又高效地构建客户机应用程序。



作者简介

Joe Winchester是 WebSphere Tools Development 小组的一名成员,他为位于联合王国,赫斯利(Hursley)的 Software Solutions 小组从事 Visual Editor for Java 的开发工作。可以通过 winchest@uk.ibm.com与 Joe 联系。


Dr. Gili Mendel has co-authored this article


Rich Kulp has co-authored this article


Peter Walker has co-authored this article


Dr. Gili Mendel是 WebSphere Tools Development 小组的一名成员,他为位于北卡罗来纳州,罗利(Raleigh)的 Software Solutions 小组从事 Visual Editor for Java 的开发工作。可以通过 gmendel@us.ibm.com与 Gili 联系。

Rich Kulp是 WebSphere Tools Development 小组的一名成员,他为位于北卡罗来纳州,罗利(Raleigh)的 Software Solutions 小组从事 Visual Editor for Java 的开发工作。可以通过 richkulp@us.ibm.com与 Rich 联系。

Peter Walker是 WebSphere Tools Development 小组的一名成员,他为位于北卡罗来纳州,罗利(Raleigh)的 Software Solutions 小组从事 Visual Editor for Java 的开发工作。可以通过 walkerp@us.ibm.com与 Peter 联系。

Rolf Kalim是 WebSphere Tools Development 小组的一名成员,他为位于北卡罗来纳州,罗利(Raleigh)的 Software Solutions 小组从事 Visual Editor for Java 的开发工作。可以通过 rkalim@us.ibm.com与 Rolf 联系。

Srimanth Gunturi是 WebSphere Tools Development 小组的一名成员,他为位于北卡罗来纳州,罗利(Raleigh)的 Software Solutions 小组从事 Visual Editor for Java 的开发工作。可以通过 sgunturi@us.ibm.com与 Sri 联系。




对本文的评价

太差! (1)
需提高 (2)
一般;尚可 (3)
好文章 (4)
真棒!(5)

建议?




回页首


IBM 公司保留在 developerWorks 网站上发表的内容的著作权。未经IBM公司或原始作者的书面明确许可,请勿转载。如果您希望转载,请通过 提交转载请求表单 联系我们的编辑团队。
    关于 IBM 隐私条约 联系 IBM 使用条款