在定制 Eclipse SWT 组件中实现 MVC
2006-02-08 12:54
393 查看
Tejas R Parajia ,软件工程师,IBM
什么是 MVC?
MVC 架构(或设计模式)是图形用户界面(GUI)的设计样式,由三部分构成:模型、视图和控制器。MVC 把表示层从数据解耦出来,也把表示从数据的操作解耦出来。
实现 MVC 架构与其他类型的应用程序有所不同。主要的区别来自如何放置和实现业务逻辑或查看呈现逻辑。与典型的 Web 应用程序不同,在这类程序中,程序员必须设计和实现所有 MVC 组件,而 Eclipse 提供的 API 可以替您做大部分控制或呈现工作。所以,不能严格地把 Eclipse 的 MVC 实现与 Web 或其他应用程序类型的 MVC 进行比较。
Eclipse JFace
Eclipse JFace 用内容提供者和标签提供者实现 MVC 架构。JFace API 包装了标准(并非不重要的)部件,例如表和树,并实现了结构化内容提供者和标签提供者。可以根据部件类型实现不同的内容提供者。面向列表的查看器会实现结构化查看器,而内容则以结构化(列表的)方式映射到部件条目上。
基类叫做
如何实现 JFace
Eclipse
Eclipse
要创建
清单 1. ExampleView 的 CreatePartControl 方法
在另一个独立类中实现
请在
getElements(Object parent)
getChildren(Object element)
注意:JFace 框架将调用这些方法。
清单 2. 创建定制的 ContentProvider
MVC 架构通常包含多个视图和一个数据源。目前在 Eclipse 平台上,只能把一个视图与一个模型相关联。但是,也可以创建多个视图,用适配器视图访问同一数据。只要把
清单 3. 将 inputChanged 方法用于不同的查看器
与 Eclipse SWT 结合使用 MVC
在多数常见 GUI 应用程序中,创建布局来显示请求的数据,或完成表单(例如用户界面)来添加或修改数据。图 1 的示例应用程序演示了如何在定制表单中,用只读和可编写模式显示来自 XML 存储的数据。它还解释了每个组件相对于 MVC 架构的角色。
图 1. 示例应用程序
图 2 显示了应用程序的类图,有助于更好地理解整体架构。
图 2. 示例应用程序的类图
创建控件
清单 4. CreatePartControl 方法初始化布局
创建表单和布局
基本布局类定义了不同的表单应用程序使用的全局方法和声明。有些充当回调机制的容器事件,也注册到了这里。
清单 5. 布局的 CreateControl 方法
创建字段(视图)
清单 6. 用 Field 类创建文本对象
简化内容提供者(模型)
方法调用会返回与每个定义的全局 ID 关联的数据。在 清单 7 所示的内容提供者中,可以使用适配器从 XML 文件或数据库检索数据。
清单 7. 在定制的 ContentProvider 中实现方法
创建了控件并初始化布局之后,表单会用控件 ID 要求内容提供者用数据填充表单控件。
清单 8. 初始化布局并填充控件的表单
结束语
Web 应用程序是 MVC 架构样式的早期实现者。但是,随着像 Eclipse 这样的简单而强大的开发平台的到来,程序员可以轻易地用更短的时间和最小的复杂程度,开发出更丰富的用户界面。
下载
什么是 MVC?
MVC 架构(或设计模式)是图形用户界面(GUI)的设计样式,由三部分构成:模型、视图和控制器。MVC 把表示层从数据解耦出来,也把表示从数据的操作解耦出来。
实现 MVC 架构与其他类型的应用程序有所不同。主要的区别来自如何放置和实现业务逻辑或查看呈现逻辑。与典型的 Web 应用程序不同,在这类程序中,程序员必须设计和实现所有 MVC 组件,而 Eclipse 提供的 API 可以替您做大部分控制或呈现工作。所以,不能严格地把 Eclipse 的 MVC 实现与 Web 或其他应用程序类型的 MVC 进行比较。
Eclipse JFace
Eclipse JFace 用内容提供者和标签提供者实现 MVC 架构。JFace API 包装了标准(并非不重要的)部件,例如表和树,并实现了结构化内容提供者和标签提供者。可以根据部件类型实现不同的内容提供者。面向列表的查看器会实现结构化查看器,而内容则以结构化(列表的)方式映射到部件条目上。
基类叫做
Viewer,它是结构化查看器的一个扩展。查看器充当部件容器。内容提供者以结构化的方式得到数据;类似地,标签提供者获得对应的标签。JFace 查看器实现检索该数据,设置对应的关联,并用数据集更新用户界面(UI)组件。它还执行选择、过滤和排序。
如何实现 JFace
Eclipse
View和
Viewer负责执行大部分 JFace 控制功能。
Viewer或者说 MVC 的视图部分,也充当部件容器;这是表示组件。
Eclipse
View实例化
Viewer、内容提供者和标签提供者,并充当模型,容纳值对象,并在
Viewer中把它们设置为
inputElement。
要创建
View,请用
createPartControl()方法实例化
Viewer。清单 1 实例化一个默认的树查看器;您也可以定制树,并用树对象作为参数,用构造函数实例化树查看器。
清单 1. ExampleView 的 CreatePartControl 方法
public class ExampleView extends ViewPart { ... public void createPartControl(Composite parent) { // define a grid layout GridLayout layout = new GridLayout(); layout.numColumns = 1; layout.marginHeight = 0; layout.marginWidth = 0; l ayout.horizontalSpacing = 0; layout.verticalSpacing = 1; parent.setLayout(layout); // create widgets createActionBar(parent); createTree(parent); // add context menu and listeners viewer.addDoubleClickListener(this); viewer.addSelectionChangedListener(openAction); // register viewer so actions respond to selection getSite().setSelectionProvider(viewer); hookContextMenu(); } private void createTree(Composite parent) { viewer = new TreeViewer(parent, SWT.SINGLE | SWT.H_SCROLL | SWT.V_SCROLL | SWT.BORDER); viewer.setContentProvider(new ExampleViewContentProvider()); viewer.setLabelProvider (new ExampleViewLabelProvider()); viewer.setSorter(new ViewerSorter()); viewer.setInput(ModelManager.getExampleModel()); viewer.getControl().setLayoutData(new GridData(GridData.FILL_BOTH)); } ... } |
ContentProvider,它是一个对象,用适合查看器类型的接口向视图提供数据。例如,您可以实现
IStructuredContentProvider或
ITreeContentProvider查看器。
请在
ContentProvider代码中实现以下一个方法,把
ContentProvider与
Viewer相关联:
getElements(Object parent)
getChildren(Object element)
注意:JFace 框架将调用这些方法。
清单 2. 创建定制的 ContentProvider
public class ExampleViewContentprovide implements ITreeContentProvide { |
inputChanged()方法包含在
ContentProvider类中即可。只要
Viewer有新的输入集,就会使用
inputChanged()方法通知
ContentProvider。
inputChanged()方法接受
Viewer作为输入参数,所以多个视图可以使用一个
ContentProvider。
清单 3. 将 inputChanged 方法用于不同的查看器
/** * Register content provider with model. */ public void inputChanged(Viewer viewer, Object oldInput, Object newInput) { if (newInput != null) { this.viewer = viewer; this.model = (ExampleDelegate)newInput; this.model.addModelListener(this); } } |
在多数常见 GUI 应用程序中,创建布局来显示请求的数据,或完成表单(例如用户界面)来添加或修改数据。图 1 的示例应用程序演示了如何在定制表单中,用只读和可编写模式显示来自 XML 存储的数据。它还解释了每个组件相对于 MVC 架构的角色。
图 1. 示例应用程序
图 2 显示了应用程序的类图,有助于更好地理解整体架构。
图 2. 示例应用程序的类图
创建控件
ExampleView充当整个应用程序的容器。它将在
createPartControl方法中初始化应用程序。
清单 4. CreatePartControl 方法初始化布局
public void createPartControl(Composite parent) { ExampleEditLayout _layout = new ExampleEditLayout(parent,SWT.NONE,FieldMode.Read,new ExampleViewContentProvider()); } |
基本布局类定义了不同的表单应用程序使用的全局方法和声明。有些充当回调机制的容器事件,也注册到了这里。
清单 5. 布局的 CreateControl 方法
public void createControls(int style) { GridData gridData; Text textFld, subjectFld; Control toLabel, ccLabel, bccLabel; Control fromDateTime; Control control; Button durationText; Button submit; GridLayout layout = new GridLayout(2, false); layout.marginWidth = 0; layout.marginHeight = 4; setLayout(layout); //Label gridData = new GridData(GridData.HORIZONTAL_ALIGN_FILL | GridData.VERTICAL_ALIGN_CENTER); gridData.horizontalIndent = 10; LabelFactory.create(this, Messages.getString("ExampleEditLayout.Title"), gridData); //$NON-NLS-1$ gridData = new GridData(GridData.HORIZONTAL_ALIGN_FILL | GridData.VERTICAL_ALIGN_CENTER); gridData.horizontalIndent = 40; LabelFactory.create(this, "", gridData); //Text gridData = new GridData(GridData.HORIZONTAL_ALIGN_FILL | GridData.VERTICAL_ALIGN_CENTER); gridData.horizontalIndent = 10; control = LabelFactory.create(this, Messages.getString("ExampleEditLayout.Email"), gridData); //$NON-NLS-1$ gridData = new GridData(GridData.HORIZONTAL_ALIGN_BEGINNING | GridData.VERTICAL_ALIGN_CENTER); gridData.horizontalIndent = 10; control = TextFactory.create(this, SWT.BORDER | SWT.V_SCROLL | SWT.WRAP, gridData, FieldMode.Edit); //$NON-NLS-1$ addField(new TextField(control, ExampleViewContentProvider.FIRST_INDEX)); //Combo gridData = new GridData(GridData.HORIZONTAL_ALIGN_FILL | GridData.VERTICAL_ALIGN_CENTER); gridData.horizontalIndent = 10; LabelFactory.create(this, Messages.getString("ExampleEditLayout.Group"), gridData); //$NON-NLS-1$ gridData = new GridData(GridData.HORIZONTAL_ALIGN_BEGINNING | GridData.VERTICAL_ALIGN_CENTER); gridData.horizontalIndent = 40; control = ComboFactory.create(this, FieldMode.Edit, false, gridData); //$NON-NLS-1$ addField(new ComboField(control, ExampleViewContentProvider.SECOND_INDEX)); ...} |
Field是一个抽象类,它定义了包含各种用户界面控件的方法,还有全局地识别这些控件的相关 ID。每个用户界面控件都是
Field的子类,并向内容提供者提供了读写能力。清单 6 用工厂模式,在
Layout类中创建了
Field。
清单 6. 用 Field 类创建文本对象
public class TextField extends Field { /** * @param control * @param id */ public TextField(Control control, int id) { super(control, id); } /* Based on the ID of the widget, values retrieved from * the content provider are set. */ public void readFromContent(IExampleContentProvider content) { String newText = (String )content.getElement(getId()); if (newText != null) ((Text )_control).setText(newText); } /* Based on the ID of the widget, values retrieved from widget are * sent back to the content provider. */ public void writeToContent(IExampleContentProvider content) { String newText = ((Text )_control).getText(); content.setElement(getId(), newText); } } |
ExampleViewContentProvider充当模型侦听器,后者扩展自
IStructuredContentProvider。它是 Eclipse API 的简单实现,提供了用于检索数据的回调。每个请求数据的条目都基于视图创建时在布局中为条目定义的惟一 ID。
方法调用会返回与每个定义的全局 ID 关联的数据。在 清单 7 所示的内容提供者中,可以使用适配器从 XML 文件或数据库检索数据。
清单 7. 在定制的 ContentProvider 中实现方法
public Object getElement(int iIndex) { switch (iIndex) { case FIRST_INDEX: return "developer@ibm.com"; case SECOND_INDEX : return new Integer(1); case FOURTH_INDEX : return new Boolean(true); case THIRD_INDEX: return new Boolean(false); case FIFTH_INDEX: return new Boolean(false); } return null; } |
清单 8. 初始化布局并填充控件的表单
public Form (Composite parent, int style, FieldMode mode, ExampleViewContentProvider content) { super(parent, style); _content = content; _style = style; setMode(mode); init(style); } private void init(int style) { createControls(style); controlsCreated(); } protected void controlsCreated() { readFromContent(); } |
Web 应用程序是 MVC 架构样式的早期实现者。但是,随着像 Eclipse 这样的简单而强大的开发平台的到来,程序员可以轻易地用更短的时间和最小的复杂程度,开发出更丰富的用户界面。
下载
描述 | 名字 | 大小 | 下载方法 |
---|---|---|---|
Example code for this article | wa-eclipsemvc_ExampleViewer.zip | 33KB | HTTP |
相关文章推荐
- 适用于WebForm Mvc的Pager分页组件C#实现
- ASP.NET MVC入门---实例演示:通过ContentResult实现主题定制
- MVC 使用Quartz.Net组件实现定时计划任务
- Eclipse配置实现定制登录界面
- MVC文件上传-使用jQuery.FileUpload和Backload组件实现文件上传
- MVC架构探究及其源码实现(5)-相关组件实现
- [学习笔记]关于在MVC上实现Devexpress组件
- Eclipse swt如何实现滚动文字
- 从一个简单的例子看UI多线程处理(基于eclipse的SWT组件)
- Eclipse中附加SWT组件
- asp.net MVC实现无组件上传图片实例介绍
- asp.net MVC实现无组件上传图片
- 定制html原生上传组件样式,实现兼容包括IE在内的所有浏览器。
- Eclipse SWT开发教程以及一个连连看游戏的代码实现下载
- iOS第三方库Eureka实现定制动画详解(二):万变不离其宗-Row组件
- 如何配置Eclipse实现定制登录界面
- Struts学习笔记2(Struts的MVC的实现组件)
- 基于ASP.NET MVC(C#)和Quartz.Net组件实现的定时执行任务调度
- MVC文件上传04-使用客户端jQuery-File-Upload插件和服务端Backload组件实现多文件异步上传
- 基于ASP.NET MVC(C#)和Quartz.Net组件实现的定时执行任务调度