`

基于eclipse GEF开发Google GWT矢量图形应用(eclipse gef on gwt)

 
阅读更多

http://archive.cnblogs.com/a/2225393/

http://code.google.com/p/gwt-html5-graph/

基于eclipse GEF开发Google GWT矢量图形应用(eclipse gef on gwt)

作者:trufun1006  来源:博客园  发布时间:2011-10-26 16:42  阅读:14 次  原文链接   [收藏]  

下面这个整合案例来自http://code.google.com/p/gwt-html5-graph/

实际的运行案例:

Demo1(GEF Sample)http://euml.trufun.net/drawx/gef-sample/Gef_sample.html

 

源码:

1、在gwt.xml中加入对GEF的依赖:

<inherits name='GEF' />
2、按照GEF API,开发相应的editparts, figures, commands, editpolicies,actions,context menus,以及图形数据的序列化
3、整合GEF和GWT。
3.1)继承drawx提供的DiagramEditorWithPalette,如下:




import org.drawx.gef.sample.client.tool.example.model.CanvasModel;


import org.drawx.gef.sample.client.tool.example.model.MyConnectionModel;


import org.drawx.gef.sample.client.tool.example.model.OrangeModel;


import org.drawx.gef.ui.editor.DiagramEditorWithPalette;


import org.drawx.gef.ui.editor.ToolPalette;


import org.eclipse.gef.EditPartFactory;


import org.eclipse.gef.requests.CreationFactory;


import org.eclipse.swt.widgets.internal.menu.MenuManager;




import com.google.gwt.user.client.ui.Image;




public class MyDiagramEditor extends DiagramEditorWithPalette{




        public MyDiagramEditor(boolean b) {


                super(b);


        }




        @Override


        public EditPartFactory getEditPartFactory() {


                return new org.drawx.gef.sample.client.tool.example.editparts.MyEditPartFactory();


        }




        @Override


        public Object getContents() {


                return new CanvasModel();


        }




        @Override


        public void initPalette(ToolPalette palette) {


                palette.addCreationTool("Create Node", new Image(Images.INSTANCE.newModel().getURL()), new CreationFactory() {




                        public Object getNewObject() {


                                return new OrangeModel();


                        }




                        public Object getObjectType() {


                                return OrangeModel.class;


                        }


                });


                palette.addConnectionTool("Create Connection", new Image(Images.INSTANCE.newConnection().getURL()), new CreationFactory() {




                        public Object getNewObject() {


                                return new MyConnectionModel();


                        }




                        public Object getObjectType() {


                                return MyConnectionModel.class;


                        }


                });


        }




        @Override


        protected void doSave() {


               


        }




        @Override


        protected void createAppActions() {


               


        }




        @Override


        protected MenuManager getContextMenu() {


                return new MyContextMenuProvider(this.getGraphicalViewer(), this


                                .getActionRegistry());


        }




}

 

3.2)将diagram editor加入到WEB页面上


private void createTab1(TabLayoutPanel p) {


                DiagramEditorWithPalette editor = new MyDiagramEditor(true);


                p.add(editor.getWidget(), "Fill Canvas");


        }

分享到:
评论

相关推荐

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

    总之,通过这个"GEF入门实例代码2",开发者可以了解到如何在Eclipse中构建一个基于GEF的图形编辑器,这不仅涉及数据模型的设计,还包括视图的绘制、用户交互的处理以及可撤销/重做机制的实现。通过实践,开发者可以...

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

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

    eclipse gef ve gmf

    GMF是Eclipse的另一个图形建模框架,它是GEF的扩展,专注于模型驱动的图形编辑器开发。GMF允许开发者定义复杂的模型和图形表示,通过模型到模型(M2M)和模型到视图(M2V)转换来生成编辑器的代码。GMF的强项在于它...

    Eclipse开发使用GEF和EMF(IBM 红皮书)中英文对照版

    《Eclipse开发使用GEF和EMF》是IBM红皮书系列中的一部经典著作,主要探讨了如何在Eclipse环境中利用GEF(图形编辑框架)和EMF( Eclipse模型框架)进行图形化应用程序的开发。这两项技术是Eclipse平台上的核心组件,...

    eclipse gef demo

    Eclipse GEF(Graphical Editing ...通过这个DEMO,开发者可以学习到如何结合Eclipse的插件机制和GEF的图形编辑框架,创建出交互式的图形化工具,这对于开发流程图、UML模型或其他复杂的可视化应用非常有帮助。

    Eclipse GEF+Draw2DAPI

    GEF 是Eclipse平台的一部分,提供了一个框架,用于开发基于模型的图形编辑器。它基于MVC(Model-View-Controller)设计模式,允许开发者分离业务逻辑和视图展示,从而实现灵活且可扩展的图形编辑解决方案。GEF主要...

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

    在"GEF入门系列宝典"中,我们将深入探讨如何使用GEF进行Eclipse插件开发,以创建自定义的图形编辑器。以下是一些关键知识点: 1. **Eclipse插件体系结构**: - 插件是Eclipse的核心组成部分,它们通过OSGi模块系统...

    eclipse gef 插件 最新版本

    它为开发者提供了一套完整的框架,用于开发基于模型的图形编辑工具,广泛应用于软件建模、系统设计等领域。最新版本的Eclipse GEF通常会包含性能优化、新功能、兼容性改进以及错误修复,以满足不断发展的开发需求。 ...

    eclipse gef插件

    总的来说,Eclipse GEF插件是一个强大的工具,它使得开发图形化应用变得更加简单和高效。通过学习和熟练掌握GEF,开发者能够构建出直观、易用且功能丰富的图形界面,提升软件的用户体验。在实际项目中,合理运用GEF...

    eclipse GEF的官方教程

    eclipse GEF的官方教程,适合初学者

    Eclipse插件开发--gef开发指南与入门系列宝典

    在"GEF开发指南-插件开发.pdf"中,你将学习到如何设置Eclipse开发环境,创建GEF项目,定义模型和视图,以及实现基本的图形编辑功能。此文档可能涵盖了以下主题: 1. 创建Eclipse插件项目:了解如何使用Eclipse的New...

    m2eclipse+gef+svn插件离线安装包

    安装m2eclipse插件时会依赖gef插件和svn插件,压缩包内包含m2eclipse + gef + svn的全部插件安装包,可以直接离线安装,本人亲测,在Eclipse3.7下安装成功,可以新建Maven项目。 需要注意的是,在离线安装时,切记...

    eclipse3.4的可视化开发GEF

    **Eclipse 3.4 可视化开发:GEF详解*...总之,Eclipse 3.4的可视化开发GEF是一个强大的框架,为开发者提供了构建图形化编辑器的强大支持。通过理解其核心概念和组件,开发者能够高效地创建出功能丰富的可视化应用程序。

    打造基于Eclipse的IDE产品

    打造基于Eclipse的集成开发环境(IDE)产品是一项复杂的工程,它需要对Eclipse的基础架构和插件开发有深入的理解。以下将详细介绍与开发Eclipse IDE产品相关的知识点,包括Eclipse的基础架构、如何扩展Eclipse的功能...

    eclipse GEF 插件

    总的来说,Eclipse GEF插件是开发图形化应用程序的强大工具,它通过提供丰富的图形组件和灵活的架构,帮助开发者轻松创建出高效直观的图形编辑器。无论是用于流程设计、UML建模还是其他领域的图形化编辑,GEF都能...

    eclipse插件 GEF-SDK-3.4.0.zip

    GEF是Eclipse平台的一个核心部分,它提供了一套框架和服务,用于构建基于模型的图形编辑器。通过GEF,开发者可以轻松地创建出具有拖放、连接、撤销/重做等功能的可视化编辑器。GEF的设计遵循Model-View-Controller...

    Eclipse的GEF插件

    Eclipse的GEF(Graphical Editing Framework)插件是一个强大的图形编辑框架,它为开发者提供了在Eclipse集成开发环境中创建可视化的图形界面和编辑器的能力。这个插件主要用于构建复杂的图形用户界面,如UML模型、...

    eclipse插件开发框架GEF API文档

    Eclipse插件开发框架GEF(Graphical Editing Framework)是一个强大的工具,用于构建基于Eclipse平台的图形化编辑器。这个API文档详细介绍了如何利用GEF进行插件开发,为开发者提供了丰富的参考资料。 1. **Eclipse...

Global site tag (gtag.js) - Google Analytics