`
xyhsm
  • 浏览: 20038 次
  • 来自: ...
最近访客 更多访客>>
社区版块
存档分类
最新评论

GEF 进阶,第三部分: Layer

    博客分类:
  • GEF
阅读更多

第三部分: Layer

在GEF中,画板是由多个Layer(层)组成的,层也可以看作是对图形进行的一种分类管理,它使图形更加明确,层次清晰。程序结构上也更容易理解和维护。层同样也是可以定制的,本文演示如何实现并插入一个自定义层,并指出了插入自定义层所应该注意的一些问题。

Layer (层)

GEF的图形是可能分布在多个层上面的,比如连线是放在Connection Layer(连接层)上的,而普通的图形(比如Shapes Example里面的长方形和椭圆)是放置在Primary Layer(主层)上的。不同类型的图形放置在不同的层上,既易于管理又结构清晰,因此层是一个非要重要的功能。层其实也是一个图形,和其他图形一样都继承自Figure类,所以我们也可以象添加普通图形一样添加层,只不过方式有点不同而已。

我们首先需要知道层是在哪里创建的,才好动手修改它们。在GEF中,每一个EditPart Viewer都有一个特殊的EditPart,叫做Root,而层的创建就在其中。因此要添加自定义的层,首先的任务就是扩展Root EditPart,一般来说,我们使用的是ScalableFreeformRootEditPart。

提示: 使用何种Root EditPart也是可以自己控制的,只需要在重载GraphicalEditor的configureGraphicalViewer方法,指定使用我们自己的Root EditPart即可。以下是一段示例代码,斜黑体部分就是具体的调用:


protected void configureGraphicalViewer() {
	super.configureGraphicalViewer();
	
	GraphicalViewer viewer = getGraphicalViewer();
	viewer.setRootEditPart(new ScalableFreeformRootEditPart());

	// more code
	……………
}

所以,这是我们能够自定义层的一个前提。

ScalableFreeformRootEditPart的createLayers()方法是创建层的关键所在,仔细观察其实现,不难看出GEF缺省定义了如图1所示的层次结构:


图1. ScalableFreeformRootEditPart缺省层结构
图1. ScalableFreeformRootEditPart缺省层结构

提示: 先添加的层在下,后添加的层在上

我们看到缺省包含了很多层,而且层中还有子层,每个层都有一个关键字来标识,我们从下到上做一个简要的描述:

  • Grid Layer: 网格层,用来显示一个网格,帮助你定位图形
  • Primary Layer: 主层,大部分的图形都放置在这个层
  • Connection Layer: 连接层,连线都放置在这一层
  • Printable Layer: 可打印层,这个层并没有实际作用,只是用来包含主层和连接层
  • Scaled Feedback Layer: 扩展反馈层,所谓反馈是指操作时显示的一些提示信息,比如你拖动一个图形时,会显示一个虚影,这就是反馈
  • Scalable Layer: 和Printable Layer一样,只是一个容器层
  • Handle Layer: Handle是指一些可以拖动的小方块,比如选择一个图形时,会显示八个用于Resize的Handle
  • Feedback Layer: 也是一个反馈层
  • Guide Layer: 帮助层

所有的层我们都可以通过getLayer()方法得到,因此我们有很大的自由去控制这些层的属性,但是如果我们要添加一个层或者修改一个层的行为,我们必须实现自己的RootEditPart。

Background Layer (背景层)

出于演示的目的,我们添加一个比较简单的层,叫做Background Layer,它的用处就是在画布上显示一个渐进的背景,我们把这个层添加到Primary Layer之前,避免覆盖主层上的图形。

注意,我们添加的这个层只是出于演示目的,实际上添加一个背景色并不用费此周章。我们只是为了说明如何添加一个自定义的层。

创建BackgroundLayer类

我们首先来创建类,对于层,我们只要继承Layer类就可以了,而Layer本身继承自Figure,它没有添加任何新的方法,如果你扩展过Figure类的话,对此就应该比较熟悉了。由于我们只是画个渐进背景色,所以只需要重载一下paintFigure方法就可以了。如下


package org.eclipse.gef.examples.shapes.layer;

import org.eclipse.draw2d.ColorConstants;
import org.eclipse.draw2d.FreeformLayer;
import org.eclipse.draw2d.Graphics;

public class BackgroundLayer extends FreeformLayer {
	public static final String BACKGROUND_LAYER = "Background Layer";
	
	public BackgroundLayer() {
		setOpaque(true);
	}
	
	@Override
	protected void paintFigure(Graphics graphics) {
		if(isOpaque()) {
			graphics.setForegroundColor(ColorConstants.white);
			graphics.setBackgroundColor(ColorConstants.lightBlue);
			graphics.fillGradient(getBounds(), true);
		}
	}
}

我们最终扩展的是FreeformLayer而不是Layer, 如果直接扩展Layer的话,我们的层会无法自动改变大小。我们推荐从FreeformLayer开始你的工作。

实现MyRootEditPart

由于我们只需要插入一个层,所以我们重载ScalableFreeformRootEditPart中的createPrintableLayers方法就可以了。再次提醒的是要注意插入的位置,先加入的层在下,后加入的在上。


package org.eclipse.gef.examples.shapes.parts;

import org.eclipse.draw2d.ConnectionLayer;
import org.eclipse.draw2d.FreeformLayer;
import org.eclipse.draw2d.FreeformLayeredPane;
import org.eclipse.draw2d.LayeredPane;
import org.eclipse.gef.editparts.ScalableFreeformRootEditPart;
import org.eclipse.gef.examples.shapes.layer.BackgroundLayer;

public class MyRootEditPart extends ScalableFreeformRootEditPart {
	@Override
	protected LayeredPane createPrintableLayers() {
		FreeformLayeredPane layeredPane = new FreeformLayeredPane();
		layeredPane.add(new BackgroundLayer(), BackgroundLayer.BACKGROUND_LAYER);
		layeredPane.add(new FreeformLayer(), PRIMARY_LAYER);
		layeredPane.add(new ConnectionLayer(), CONNECTION_LAYER);
		return layeredPane;
	}
}

让我们自定义的RootEditPart生效是相当简单的事,只要修改ShapesEditor. configureGraphicalViewer(),将ScalableFreeformRootEditPart替换为MyRootEditPart即可。就不列出代码了。完成之后我们就可以看到画板有了一个渐进式的背景,如图2所示:


图2. 背景层
图2. 背景层 


结束语

GEF中的几乎一切东西都可以定制,本文介绍的是层的定制,层对于一个复杂图形应用(比如布线程序)来说是非常重要的。GEF的RootEditPart是层创建的地方,同时getLayer()方法可以让我们方便的访问层对象,而添加一个自定义层也是相当简单。

分享到:
评论
1 楼 qwe_1_23 2012-12-10  
[/size]ccccccc打csadc 程序中Ccz   czC asdadv刹[size=large]徐现在在城中村[/size]v刹下载v刹中v刹[size=medium][/b][b] 初学者
引用
初学者在新城[flash=200,200][/flash]v刹徐在新城v刹徐行程中v型从像正常程序

相关推荐

    GEF 进阶,第一部分: Anchor

    GEF示例 博文链接:https://xyhsm.iteye.com/blog/67809

    GEF 进阶+源码.rar

    1. **模型-视图-控制器(MVC)架构**:GEF遵循MVC设计模式,将图形界面的逻辑分离为模型(Model)、视图(View)和控制器(Controller)三部分,使得代码更易于维护和扩展。 2. **图元工厂(Figure Factory)**:...

    GEF进阶 IBM社区文档整理

    - **IBM社区文档**:“GEF进阶,第一部分:Anchor”(http://www.ibm.com/developerworks/cn/opensource/os-ecl-gef/part1/index.html) - **其他资源**:了解更多的GEF教程和技术文档,可以帮助开发者更好地理解和运用...

    GEF-ALL-3.2.2

    GEF: Graphical Editing Framework <br>GEF是一套MVC Framework,它能帮你比较容易的建立图形化的编辑器,V(View)的部分常常是基于SWT的Draw2D,因此Draw2D也看作是GEF的一部分。依赖:org.eclipse.gef***, org...

    gef:Eclipse GEF:trade_mark:

    当前的代码库是与2004年以来提供的原始Draw2d 3.x , GEF(MVC)3.x和Zest 1.x项目组件并行开发的。直到4.0版本为止。 0(Neon)在2016年发布,此代码库分别称为'GEF4'或org.eclipse.gef4 ,这就是为什么这些术语仍...

    RCP与GEF课件,介绍RCP和GEF各组成部分和工作原理

    **RCP(Rich Client Platform)** 是Eclipse项目的一个核心组成部分,它提供了一个框架,用于构建功能丰富的桌面应用程序。RCP允许开发者利用Java语言和Eclipse插件体系结构来创建可扩展、模块化的应用程序,这些...

    gef 资料 通俗易懂

    Gef框架详解:初学者入门与进阶指南 Gef(GDB Enhanced Framework)是一个强大的GDB(GNU调试器)扩展,旨在提供一个更现代、功能更丰富的交互式环境,用于调试C、C++和其他支持GDB的语言。这个压缩包包含了关于Gef...

    Eclipse插件开发:GEF入门系列宝典

    3.GEF 的入门方法: 学习 GEF 的最好方法是结合具体的例子,一边看代码,一边对照文档,然后自己再动手做一做。选择简单的例子,例如 pt1,pt2 等,逐步增加功能,了解 GEF 的实现机制。 4.GEF 的应用: GEF 广泛...

    GEF教程及demo源码

    GEF主要由三部分组成:MVC(Model-View-Controller)、Command和Zest。MVC模式用于分离数据模型、视图和控制器,使得代码结构清晰,易于维护。Command模块则实现了撤销/重做功能,使得用户操作可逆。Zest是GEF的图表...

    [翻译]Eclipse图形化编辑框架(GEF)/更新第7章:层和视图

    **Eclipse图形化编辑框架(GEF)** Eclipse图形化编辑框架(GEF)是Eclipse平台中的一个重要组件,主要用于构建可自定义的图形编辑工具。它为开发人员提供了一套全面的API和设计模式,使得创建复杂的图形用户界面...

    gef 转折线的相关方法实现和 GEF的API chm 格式

    Gef,全称Graphical Editing Framework,是Eclipse项目的一部分,是一个用于构建图形编辑框架的开源库,主要用于开发基于Swing或SWT的图形用户界面应用。这个框架支持模型驱动的编辑环境,允许开发者创建复杂的图形...

    java gef开发实例

    3. **MVC在GEF中的应用**: - **模型**:可以是一个自定义的Java类,包含业务数据,不直接与视图或控制器交互。 - **视图**:通过创建和管理Figures来展示模型,当模型改变时,自动更新视图。 - **控制器**:通过...

    Eclipse插件开发:GEF入门系列宝典_gef_

    由于工作的需要,最近开始研究GEF(Graphical Editor Framework)这个框架,它可以用来给用户提供图形化编辑模型的功能,从而提升用户体验,典型的应用如图形化的流程设计器、UML类图编辑器等等。

    界面设计GEF应用实例

    【描述】中的"六个小例子"是指通过一系列逐步进阶的教程,帮助开发者从基础到高级理解并掌握GEF的使用。这些例子旨在帮助初学者逐步理解GEF的工作原理,以及如何利用其功能构建复杂的图形用户界面。每个例子都增加了...

    GEF开发指南---插件开发

    - **GEF的基本结构**:一个典型的GEF项目包括三个核心组成部分:模型(Model)、控制器(Controller)和视图(View)。文档提到了这些组成部分对应的包结构。 #### 五、创建Editor - **创建Editor**:文档详细描述...

    GEF_Demo_Code20170307

    【GEF_Demo_Code20170307】是一个关于图形编辑框架(Graphical Editing Framework,简称GEF)的示例代码集合,发布于2017年3月7日。这个项目旨在演示如何利用GEF进行图形界面开发,并且特别关注了通过适配器...

    GEF入门实例代码2《Eclipse插件开发》中实例

    这个实例代码2是《Eclipse插件开发》教程中的一部分,旨在帮助初学者理解如何利用GEF来创建自定义的图形编辑器。在Eclipse插件开发中,GEF提供了一套强大的框架,使得开发者可以方便地构建出功能丰富的图形用户界面...

    gef学习文档+学习源码

    同时,提供的源码部分可以帮助你理解Gef的内部工作原理,加深对逆向工程和调试的理解。 总之,Gef是一个强大的工具,它简化了逆向工程和调试的过程,尤其在处理复杂项目如MVC架构和富客户端开发时,能显著提升...

Global site tag (gtag.js) - Google Analytics