使用Eclipse RCP进行桌面程序开发（三）：视图和透视图

男娘i 2022-08-13 16:43 252阅读 0赞

[使用Eclipse RCP进行桌面程序开发（一）：快速起步 ][Eclipse RCP]  
[使用Eclipse RCP进行桌面程序开发（二）：菜单、工具栏和对话框 ][Eclipse RCP 1]  
  
Eclipse RCP开发中，和用户进行交互最多的界面，应该是视图了，而透视图就是将已有的视图、菜单、工具栏、编辑器等等进行组合和布局。看完这一节，我们就可以建立如下图这样的程序界面了。  
  
![rcp25.JPG][]  
  
首先我们来介绍一下视图，建立一个视图其实非常简单，只要从org.eclipse.ui.part.ViewPart继承一个类，然后在plugin.xml中进行视图的配置。其中，向视图中添加控件的操作，我们即可以手工编写，也可以使用Designer插件，我这里推荐大家使用Designer插件，该插件对RCP提供功能非常强大的支持，如果使用Designer插件开发视图，则plugin.xml文件也不需要我们手动修改了。  
  
比如我们上图中的第一个视图，就是从ViewPart继承一个类，然后在上面加入了几个swt的控件，做得非常得简单，而它的配置文件如下：

1 ![None.gif][] < extension  
 2 ![None.gif][]          point ="org.eclipse.ui.views" >  
3 ![None.gif][]       < view  
 4 ![None.gif][]             class ="cn.blogjava.youxia.views.FirstView"   
 5 ![None.gif][]            id ="cn.blogjava.youxia.views.FirstView"   
 6 ![None.gif][]            name ="第一个View" />  
7 ![None.gif][] </ extension >

可以看到，实现这个视图的class为cn.blogjava.youxia.views.FirstView，那么我们看看FirstView.java吧：

1 ![None.gif][] package cn.blogjava.youxia.views;  
 2 ![None.gif][]  
 3 ![None.gif][] import org.eclipse.jface.action.IMenuManager;  
 4 ![None.gif][] import org.eclipse.jface.action.IToolBarManager;  
 5 ![None.gif][] import org.eclipse.jface.viewers.TableViewer;  
 6 ![None.gif][] import org.eclipse.swt.SWT;  
 7 ![None.gif][] import org.eclipse.swt.widgets.Composite;  
 8 ![None.gif][] import org.eclipse.swt.widgets.Label;  
 9 ![None.gif][] import org.eclipse.swt.widgets.Table;  
10 ![None.gif][] import org.eclipse.swt.widgets.Text;  
11 ![None.gif][] import org.eclipse.ui.part.ViewPart;  
12 ![None.gif][]  
13 ![ExpandedBlockStart.gif][] public  class FirstView  extends ViewPart  \{  
14![InBlock.gif][]  
15![InBlock.gif][]    private Table table;  
16![InBlock.gif][]    private Text text\_1;  
17![InBlock.gif][]    private Text text;  
18![InBlock.gif][]    public static final String ID = "cn.blogjava.youxia.views.FirstView"; //$NON-NLS-1$  
19![InBlock.gif][]  
20![ExpandedSubBlockStart.gif][]    /\*\*  
21![InBlock.gif][]     \* Create contents of the view part  
22![InBlock.gif][]     \* @param parent  
23![ExpandedSubBlockEnd.gif][]     \*/  
24![InBlock.gif][]    @Override  
25![ExpandedSubBlockStart.gif][]    public void createPartControl(Composite parent) \{  
26![InBlock.gif][]        Composite container = new Composite(parent, SWT.NONE);  
27![InBlock.gif][]  
28![InBlock.gif][]        final Label label = new Label(container, SWT.NONE);  
29![InBlock.gif][]        label.setText("姓名：");  
30![InBlock.gif][]        label.setBounds(56, 41, 36, 12);  
31![InBlock.gif][]  
32![InBlock.gif][]        text = new Text(container, SWT.BORDER);  
33![InBlock.gif][]        text.setBounds(98, 38, 80, 15);  
34![InBlock.gif][]  
35![InBlock.gif][]        final Label label\_1 = new Label(container, SWT.NONE);  
36![InBlock.gif][]        label\_1.setText("性别：");  
37![InBlock.gif][]        label\_1.setBounds(212, 41, 30, 12);  
38![InBlock.gif][]  
39![InBlock.gif][]        text\_1 = new Text(container, SWT.BORDER);  
40![InBlock.gif][]        text\_1.setBounds(252, 38, 80, 15);  
41![InBlock.gif][]  
42![InBlock.gif][]        final TableViewer tableViewer = new TableViewer(container, SWT.BORDER);  
43![InBlock.gif][]        //tableViewer.setInput(new Object());  
44![InBlock.gif][]        table = tableViewer.getTable();  
45![InBlock.gif][]        table.setBounds(56, 75, 374, 143);  
46![InBlock.gif][]        table.setItemCount(10);  
47![InBlock.gif][]        table.setLinesVisible(true);  
48![InBlock.gif][]        //  
49![InBlock.gif][]        createActions();  
50![InBlock.gif][]        initializeToolBar();  
51![InBlock.gif][]        initializeMenu();  
52![ExpandedSubBlockEnd.gif][]            \}  
53![InBlock.gif][]  
54![ExpandedSubBlockStart.gif][]    /\*\*  
55![InBlock.gif][]     \* Create the actions  
56![ExpandedSubBlockEnd.gif][]     \*/  
57![ExpandedSubBlockStart.gif][]    private void createActions() \{  
58![InBlock.gif][]        // Create the actions  
59![ExpandedSubBlockEnd.gif][]    \}  
60![InBlock.gif][]  
61![ExpandedSubBlockStart.gif][]    /\*\*  
62![InBlock.gif][]     \* Initialize the toolbar  
63![ExpandedSubBlockEnd.gif][]     \*/  
64![ExpandedSubBlockStart.gif][]    private void initializeToolBar() \{  
65![InBlock.gif][]        IToolBarManager toolbarManager = getViewSite().getActionBars()  
66![InBlock.gif][]                .getToolBarManager();  
67![ExpandedSubBlockEnd.gif][]    \}  
68![InBlock.gif][]  
69![ExpandedSubBlockStart.gif][]    /\*\*  
70![InBlock.gif][]     \* Initialize the menu  
71![ExpandedSubBlockEnd.gif][]     \*/  
72![ExpandedSubBlockStart.gif][]    private void initializeMenu() \{  
73![InBlock.gif][]        IMenuManager menuManager = getViewSite().getActionBars()  
74![InBlock.gif][]                .getMenuManager();  
75![ExpandedSubBlockEnd.gif][]    \}  
76![InBlock.gif][]  
77![InBlock.gif][]    @Override  
78![ExpandedSubBlockStart.gif][]    public void setFocus() \{  
79![InBlock.gif][]        // Set the focus  
80![ExpandedSubBlockEnd.gif][]    \}  
81![InBlock.gif][]  
82![ExpandedBlockEnd.gif][]    \}

其中，添加控件的代码由Disgner插件自动生成。这个时候，如果我们运行程序的话，我们的视图还不会被显示出来。为了让我们的视图可以显示，我们还需要修改Perspective.java文件，代码如下：

1 ![None.gif][]package cn.blogjava.youxia.rcp\_start ;  
  2 ![None.gif][]  
 3 ![None.gif][]import org.eclipse.ui.IPageLayout ;  
  4 ![None.gif][]import org.eclipse.ui.IPerspectiveFactory ;  
  5 ![None.gif][]  
 6 ![None.gif][]public class Perspective implements IPerspectiveFactory \{  
 7 ![None.gif][]  
 8 ![None.gif][]    public void createInitialLayout(IPageLayout layout) \{  
 9 ![None.gif][]        String editorArea = layout.getEditorArea() ;  
 10 ![None.gif][]        layout.addView("cn.blogjava.youxia.views.FirstView", IPageLayout.RIGHT, 0.2f, editorArea) ;  
 11 ![None.gif][]    \}  
12 ![None.gif][]\}

运行程序，得到如下效果：  
  
![rcp23.JPG][]

我们可以发现，上面这个视图的标签不是我们通常看到的波浪形，我们可以通过配置文件的方式来更改产品的样式。  
首先，在plugin.xml中对org.eclipse.core.runtime.products扩展点的属性进行更改，如下：

1 ![None.gif][]<extension  
 2 ![None.gif][]         id="product"  
 3 ![None.gif][]         point="org.eclipse.core.runtime.products">  
 4 ![None.gif][]      <product  
 5 ![None.gif][]            application="cn.blogjava.youxia.rcp\_start.application"  
 6 ![None.gif][]            name="第一个RCP程序">  
 7 ![None.gif][]         <property  
 8 ![None.gif][]               name="preferenceCustomization"  
 9 ![None.gif][]               value="plugin\_customization.ini"/>  
10 ![None.gif][]      </product>  
11 ![None.gif][]</extension>

可见，我们为我们的产品添加了一个prefereneCustomization属性，该属性的值为plugin\_customization.ini文件，在该文件中，我们可以配置我们的样式。在这里，它的内容如下：

1 ![None.gif][]org.eclipse.ui/SHOW\_TRADITIONAL\_STYLE\_TABS=false  
2 ![None.gif][]org.eclipse.ui/DOCK\_PERSPECTIVE\_BAR=topRight

事实上，在这个文件中可以定义的参数有上百个，大家可以查看Eclipse的文档。  
这个时候，效果应该是这样的了：  
![rcp24.JPG][]  
  
好了，我们现在对以上的代码做一个总结。我不是写教科书，在Blog中也没有写得那么详细的条件。我们这里主要关注在哪个地方对代码进行扩展，可以达到我们想要的效果。比如，我们要创建视图，就是需要扩展org.eclipse.ui.part.ViewPart类，然后向其中添加控件，再然后配置plugin.xml文件，最后修改透视图的代码，以便它能够显示出来。  
  
在ViewPart类中，我们添加控件的操作主要是在public void createPartControl(Composite parent)这个方法中进行，而方法最后会调用以下三个方法：  
createActions();  
initializeToolBar();  
initializeMenu();  
从这三个方法的方法名我们不难看出，它们的功能是创建视图特有的菜单栏和工具栏的，结合上一小节的内容，我们应该很快就可以探索到怎么给视图添加漂亮的工具栏了，这里我不再罗嗦。  
  
再来看Perspective.java，不难发现，所有的透视图类都需要实现IPerspectiveFactory接口，而该接口的createInitialLayout方法，就是描述工作台窗口中编辑器和视图的布局。默认情况下，透视图中只包含一个编辑器区域，就是我们第一节中看到的那个效果。在createInitialLayou中，我们可以通过以下几个方法向透视图中添加视图、编辑器和菜单：  
addView   —— 添加视图  
addActionSet —— 添加菜单和工具栏  
createFolder —— 创建一个IForderLayou，可以让多个视图重叠在同一个位置  
  
写到这里，肯定有人会问，如果我要创建一个象Eclipse中的资源视图这样的视图，该怎么做呢？这我们就要感谢org.eclipse.jface.viewers包了，Viewer，这里翻译为查看器，它和视图是不一样的。JFace查看器是Jface对SWT部件的封装，它简化了我们对小部件的操作。在使用查看器的时候，它的数据使用单独的模型对象来保存，使用查看器的setInput方法可以为查看器设置模型，此外，在使用查看器的时候，需要为它提供ContentProvider（内容提供器）和LabelProvider（标签提供器）。  
  
JFace查看器主要分为以下几类：  
1. ListViewer： 对应于SWT的列表控件，目的是将列表中的元素映射至SWT列表控件  
2. TreeViewer： 对应于SWT的树控件，提供树的展开和折叠等基本操作  
3. TableViewer： 对应于SWT的表控件，映射表中的元素  
4. TextViewer： 对应于SWT的StyledText控件，创建编辑器的时候，使用这个查看器是最合适不过了。  
  
好了，介绍性的文字就写到这里，我想大家一定已经知道了探索的方向。下面，我们看一个简单的示例，就是这篇文章开头给出的效果图。它是我模仿医院管理系统做的一个简单例子，左边的视图就是使用了一个ListView查看器。这里给出它的关键代码：

1 ![ExpandedBlockStart.gif][] public  void createPartControl(Composite parent)  \{  
 2![InBlock.gif][]          
 3![InBlock.gif][]  
 4![InBlock.gif][]        viewer = new ListViewer(parent, SWT.BORDER);  
 5![InBlock.gif][]        viewer.setContentProvider(new PersonContentProvider());  
 6![InBlock.gif][]        viewer.setLabelProvider(new PersonLabelProvider());  
 7![InBlock.gif][]        viewer.setInput(new PersonModel());  
 8![InBlock.gif][]          
 9![InBlock.gif][]        createActions();  
10![InBlock.gif][]        initializeToolBar();  
11![InBlock.gif][]        initializeMenu();  
12![ExpandedBlockEnd.gif][]    \}

可以看到，这里需要设置内容提供器和标签提供器和模型。下面，我们先创建一个病人类Person.java：

1 ![None.gif][] package cn.blogjava.youxia.views;  
 2 ![None.gif][]  
 3 ![ExpandedBlockStart.gif][] public  class Person  \{  
 4![InBlock.gif][]      
 5![InBlock.gif][]    private String name;  
 6![InBlock.gif][]    private String sex;  
 7![ExpandedSubBlockStart.gif][]    public String getName() \{  
 8![InBlock.gif][]        return name;  
 9![ExpandedSubBlockEnd.gif][]    \}  
10![ExpandedSubBlockStart.gif][]    public void setName(String name) \{  
11![InBlock.gif][]        this.name = name;  
12![ExpandedSubBlockEnd.gif][]    \}  
13![ExpandedSubBlockStart.gif][]    public String getSex() \{  
14![InBlock.gif][]        return sex;  
15![ExpandedSubBlockEnd.gif][]    \}  
16![ExpandedSubBlockStart.gif][]    public void setSex(String sex) \{  
17![InBlock.gif][]        this.sex = sex;  
18![ExpandedSubBlockEnd.gif][]    \}  
19![InBlock.gif][]  
20![ExpandedBlockEnd.gif][]\}

下面，创建模型类PersonModel.java，在构造函数中我们向List中填入了几个初始化数据：

1 ![None.gif][] package cn.blogjava.youxia.views;  
 2 ![None.gif][] import java.util.ArrayList;  
 3 ![None.gif][]  
 4 ![ExpandedBlockStart.gif][] public  class PersonModel  \{  
 5![InBlock.gif][]      
 6![InBlock.gif][]    private ArrayList<Person> list = new ArrayList<Person>();  
 7![InBlock.gif][]      
 8![ExpandedSubBlockStart.gif][]    public interface Listener\{  
 9![InBlock.gif][]        public void add(Person p);  
10![InBlock.gif][]        public void remove(Person p);  
11![ExpandedSubBlockEnd.gif][]    \}  
12![InBlock.gif][]      
13![InBlock.gif][]    private Listener listener;  
14![InBlock.gif][]      
15![ExpandedSubBlockStart.gif][]    public PersonModel()\{  
16![InBlock.gif][]        //向list里面填入几个初始化数据  
17![InBlock.gif][]        Person p1 = new Person();  
18![InBlock.gif][]        p1.setName("病人1");  
19![InBlock.gif][]        p1.setSex("男");  
20![InBlock.gif][]        list.add(p1);  
21![InBlock.gif][]          
22![InBlock.gif][]        Person p2 = new Person();  
23![InBlock.gif][]        p2.setName("病人2");  
24![InBlock.gif][]        p2.setSex("女");  
25![InBlock.gif][]        list.add(p2);  
26![InBlock.gif][]          
27![ExpandedSubBlockEnd.gif][]    \}  
28![InBlock.gif][]  
29![ExpandedSubBlockStart.gif][]    public void setListener(Listener listener)\{  
30![InBlock.gif][]        this.listener = listener;  
31![ExpandedSubBlockEnd.gif][]    \}  
32![InBlock.gif][]      
33![ExpandedSubBlockStart.gif][]    public void add(Person p)\{  
34![InBlock.gif][]        list.add(p);  
35![ExpandedSubBlockStart.gif][]        if(listener != null)\{  
36![InBlock.gif][]            listener.add(p);  
37![ExpandedSubBlockEnd.gif][]        \}  
38![ExpandedSubBlockEnd.gif][]    \}  
39![InBlock.gif][]      
40![ExpandedSubBlockStart.gif][]    public void remove(Person p)\{  
41![InBlock.gif][]        list.remove(p);  
42![ExpandedSubBlockStart.gif][]        if(listener != null)\{  
43![InBlock.gif][]            listener.remove(p);  
44![ExpandedSubBlockEnd.gif][]        \}  
45![ExpandedSubBlockEnd.gif][]    \}  
46![InBlock.gif][]      
47![ExpandedSubBlockStart.gif][]    public ArrayList elements()\{  
48![InBlock.gif][]        return list;  
49![ExpandedSubBlockEnd.gif][]    \}  
50![ExpandedBlockEnd.gif][]\}

在这里，我们还定义了一个Listener接口，为什么要有这么一个接口呢？就是为了让我们模型中的数据被改变时，查看器能够相应更改。下面，我们实现内容提供器，该内容提供器实现了PersonModel中定义的Listener接口，如下PersonContentProvider.java：

1 ![None.gif][] package cn.blogjava.youxia.views;  
 2 ![None.gif][]  
 3 ![None.gif][] import org.eclipse.jface.viewers.IStructuredContentProvider;  
 4 ![None.gif][] import org.eclipse.jface.viewers.Viewer;  
 5 ![None.gif][] import org.eclipse.jface.viewers.ListViewer;  
 6 ![None.gif][]  
 7 ![None.gif][] import cn.blogjava.youxia.views.PersonModel.Listener;  
 8 ![None.gif][]  
 9 ![None.gif][] public  class PersonContentProvider  implements IStructuredContentProvider,  
10 ![ExpandedBlockStart.gif][]        Listener  \{  
11![InBlock.gif][]  
12![InBlock.gif][]    PersonModel input;  
13![InBlock.gif][]    ListViewer viewer;  
14![InBlock.gif][]      
15![ExpandedSubBlockStart.gif][]    public Object\[\] getElements(Object inputElement) \{  
16![InBlock.gif][]        // TODO 自动生成方法存根  
17![InBlock.gif][]        return input.elements().toArray();  
18![ExpandedSubBlockEnd.gif][]    \}  
19![InBlock.gif][]  
20![ExpandedSubBlockStart.gif][]    public void dispose() \{  
21![InBlock.gif][]        // TODO 自动生成方法存根  
22![ExpandedSubBlockStart.gif][]        if(input != null)\{  
23![InBlock.gif][]            input.setListener(null);  
24![ExpandedSubBlockEnd.gif][]        \}  
25![InBlock.gif][]        input = null;  
26![InBlock.gif][]  
27![ExpandedSubBlockEnd.gif][]    \}  
28![InBlock.gif][]  
29![ExpandedSubBlockStart.gif][]    public void inputChanged(Viewer viewer, Object oldInput, Object newInput) \{  
30![InBlock.gif][]        // TODO 自动生成方法存根  
31![InBlock.gif][]        viewer = (ListViewer)viewer;  
32![InBlock.gif][]        input = (PersonModel)newInput;  
33![InBlock.gif][]        input.setListener(this);  
34![InBlock.gif][]  
35![ExpandedSubBlockEnd.gif][]    \}  
36![InBlock.gif][]  
37![ExpandedSubBlockStart.gif][]    public void add(Person p) \{  
38![InBlock.gif][]        // TODO 自动生成方法存根  
39![InBlock.gif][]        viewer.add(p);  
40![ExpandedSubBlockEnd.gif][]    \}  
41![InBlock.gif][]  
42![ExpandedSubBlockStart.gif][]    public void remove(Person p) \{  
43![InBlock.gif][]        // TODO 自动生成方法存根  
44![InBlock.gif][]        viewer.remove(p);  
45![ExpandedSubBlockEnd.gif][]    \}  
46![InBlock.gif][]  
47![ExpandedBlockEnd.gif][]\}

我们知道，列表中的元素都是Person类的对象，怎么让他们显示出来呢，需要实现标签提供器，在标签提供器中，我们可以设置对象显示的图标和文字，如下PersonLabelProvider.java：

1 ![None.gif][] package cn.blogjava.youxia.views;  
 2 ![None.gif][]  
 3 ![None.gif][] import org.eclipse.jface.viewers.ILabelProvider;  
 4 ![None.gif][] import org.eclipse.jface.viewers.ILabelProviderListener;  
 5 ![None.gif][] import org.eclipse.swt.graphics.Image;  
 6 ![None.gif][]  
 7 ![ExpandedBlockStart.gif][] public  class PersonLabelProvider  implements ILabelProvider  \{  
 8![InBlock.gif][]  
 9![ExpandedSubBlockStart.gif][]    public Image getImage(Object element) \{  
10![InBlock.gif][]        return null;  
11![ExpandedSubBlockEnd.gif][]    \}  
12![InBlock.gif][]  
13![ExpandedSubBlockStart.gif][]    public String getText(Object element) \{  
14![InBlock.gif][]        // TODO 自动生成方法存根  
15![InBlock.gif][]        return ((Person)element).getName();  
16![ExpandedSubBlockEnd.gif][]    \}  
17![InBlock.gif][]  
18![ExpandedSubBlockStart.gif][]    public void addListener(ILabelProviderListener listener) \{  
19![InBlock.gif][]        // TODO 自动生成方法存根  
20![InBlock.gif][]  
21![ExpandedSubBlockEnd.gif][]    \}  
22![InBlock.gif][]  
23![ExpandedSubBlockStart.gif][]    public void dispose() \{  
24![InBlock.gif][]        // TODO 自动生成方法存根  
25![InBlock.gif][]  
26![ExpandedSubBlockEnd.gif][]    \}  
27![InBlock.gif][]  
28![ExpandedSubBlockStart.gif][]    public boolean isLabelProperty(Object element, String property) \{  
29![InBlock.gif][]        // TODO 自动生成方法存根  
30![InBlock.gif][]        return false;  
31![ExpandedSubBlockEnd.gif][]    \}  
32![InBlock.gif][]  
33![ExpandedSubBlockStart.gif][]    public void removeListener(ILabelProviderListener listener) \{  
34![InBlock.gif][]        // TODO 自动生成方法存根  
35![InBlock.gif][]  
36![ExpandedSubBlockEnd.gif][]    \}  
37![InBlock.gif][]  
38![ExpandedBlockEnd.gif][]\}

运行程序，就得到了文章开头的效果，但是不能在右边的视图中显示病人的详细信息。  
  
如果要做到视图的交互，需要添加事件的监听器。使用Java 进行GUI开发的人应该都不会陌生，而我在RCP上，也处于探索阶段，更深一步的内容，让我们自己慢慢研究吧。

[Eclipse RCP]: http://www.blogjava.net/youxia/archive/2006/11/17/81852.html
[Eclipse RCP 1]: http://www.blogjava.net/youxia/archive/2006/11/20/82388.html
[rcp25.JPG]: /images/20220810/30ec9e3c71a647fe8c04d9685d1815f8.png
[None.gif]: /images/20220810/15e9f3c5756b416f9666363bdb073813.png
[ExpandedBlockStart.gif]: /images/20220810/269f47b62d2940bfaeb2d4d2c4715041.png
[InBlock.gif]: /images/20220810/82d6005b554444f49eacb795dc3cbdb6.png
[ExpandedSubBlockStart.gif]: /images/20220810/d5cc1da00418419abbbb510fcbb83af2.png
[ExpandedSubBlockEnd.gif]: /images/20220810/6e5a17eb400b44dea4870d47bc893191.png
[ExpandedBlockEnd.gif]: /images/20220810/b693ade9836041b0a7b1c49b706d6ffa.png
[rcp23.JPG]: /images/20220810/43e0328b6c1a4a9d8ffcc1cc19b000dc.png
[rcp24.JPG]: /images/20220810/c38f7f9681824bdb91fb9f96156309e6.png