深入浅出Web Page Editor之二:布局引擎的四个层次

1. 简介

既然WPE是个html可视化编辑器,那么必然也会像浏览器一样有一个排版引擎之类的东西存在着。WPE的排版引擎主要可分为这么四个层次:

  •  CSS层
  •  HTML层
  •  Tag Converter层
  •  Edit层

给各层的命名可能与它们真实的作用稍微有点出入,但也一时找不到其它命名了。下面就对各层分别说明。

2.

Read the rest

RCP开发中引入第三方jar包时的几个陷阱

其实我一直觉得这种东西算不上技术,只是一些小知识点罢了,知道则有,不知则无,去网上搜一搜就出来了。网上也有不少人已经写过一些这方面的东西,但有些陷阱还是没有特别的点明。RCP开发简直就是一个坑的世界,即使你侥幸没掉进这个坑,后面还有无数个坑在等着你。搞得现在大部分的时间都是花在如何从坑里爬出来,而不是如何朝着既定目标前进了。 RCP开发/eclipse插件开发在对第三方jar包的引入上,与普通java应用有着诸多不同。以下几个问题,应该特别引起重视:

1.不要直接在工程属性->Java Build Path页中引入jar包

在我们的思维定式下,引入第三方包就是直接右击工程,进入Properties,再找到  build Path页。但是这在eclipse插件开发中是绝对不提倡的,正确的做法是打开本插件的plugin.xml文件,进入runtime页,在ClassPath区里进行增删。因为这样,才会在MAINFEST.MF文件的Bundle-ClassPath项中有相应同步。

2.不要忘了“.”

如果你没有引入第三方包,没加这个”.”还不要紧。但是如果对1中提到的地方作了修改,而在ClassPath里没有加一个名为”.”的项,最后所有原本就存在的类全都不包含在ClassPath里了。 … Read the rest

Web Page Editor中绝对定位(absolute)问题的解决

既然有所谓“问题的解决”,那么必然就意味着原来是有问题的。原生态的Web Page Editor中默认的absolute开关是关着的(是的,虽然很费解,但它的确是关着的)。所以即使你在代码里写了带有position:absolute,它也会直接将其忽略掉。
打开这个开关的方法是,来到类PDPreferences中,将static属性DEFAULT_CSS_ENABLE_ABSOLUTE_POSITIONING设为true;
但是如果仅仅设其为true,若你在一个空文档里写入一行:

<div style=’”position:absolute;left:10,;top10;”。
然后用web page editor打开此文档,你会发现Console视图下会发现报了一堆NullPointerException错误,且整个视图都比较混乱。跟踪调试一段时间后,我发现其根本原因在于CSSLayout::findContainingPositionedFigure()返回了一个空值。… Read the rest

在RCP程序中集成Jetty

jetty是个开源的serverlt容器,由于良好的设计,它非常容易被嵌入到其它程序中,作为一个内嵌服务器而存在。
那么我们如何在自己的RCP程序中使用Jetty呢?

方法一:使用扩展点

这种方法比较容易实现,但缺点是无法在运行时改变参数,因为它的参数基本上都是在plugin.xml里就写好的。使用扩展点去集成Jetty,只需要在Plugin dependences 页面中添加如下插件:

javax.servlet
org.mortbay.jetty.server
org.mortbay.jetty.util
org.eclipse.equinox.http.jetty

Read the rest

为 Web Page Editor 定制控件

Web Page Editor本身就自带了HTML和JSP的两大组控件,但是这些控件功能太简单了,你拖一个div控件出来,也就生成一个<div></div>,拖一个a控件出来,就生成一个<a></a>。有那拖的功夫,还不如自己拿键盘敲呢。比起Dreamweaver和Myeclipse的控件来说,差了不知道几个数量级。

想要定制控件,先得看看Palette(就是控件面版)上的每一项是怎么新建出来的。HTML和JSP控件最终都利用了以下代码在Palette中新建条目。

	private TagToolPaletteEntry internalCreateTagEntry(final TaglibPaletteDrawer category,
			final 
Read the rest

为Web Page Editor添加拖动功能

对于可视化的页面编辑来说,控件的全局拖动功能是必不可少的。但很奇怪的是,原生的org.eclipse.jst.pagedesigner插件并没有实现这一功能(这个官方插件简直就是个渣!)。没关系,源代码在手,我们自己搞定它!

拖动功能对应的Command是MoveNodeCommand。原有的拖动只是调换两个元素的位置,不能拖动到画布上的任意空位置。对GEF、Draw2D有过了解的朋友应该对ToolbarLayout、FlowLayout和XYLayout有所印象。前两者都是继承自OrderedLayout,它们会按指定的方向排列显示图形,拖动不同的图形只会改变这个排列顺序。Web page editor中的layout就和这种layout比较相似,所以在原本的环境中,根本没有考虑当一个标签为postion:absolute时的全局拖动该怎么处理。

原有的MoveNodeCommand构造函数形式为

 MoveNodeCommand(IHTMLGraphicalViewer viewer,IDOMPosition insertionPoint, Node originalNode)
Read the rest

深入浅出Web Page Editor

1 简介

Web Page Editor(以下简称WPE)是eclipse开源子项目WTP的一部分。其插件名全称为:org.eclipse.jst.pagedesigner。Java EE开发环境会自带这个插件包。如果没有,也可以到http://download.eclipse.org/webtools/downloads/页面下载。它主要提供一个WYSIWYG的Web开发环境,支持控件拖拽,CSS可视化编辑等等。由于它是开源的,所以一般常常可以用来作为开发Web开发RCP程序的基础。它本身也预留了插件接口,以方便开发人员扩充自定义插件,以供拖放。

目前这个版本1.3.2的Page Editor还残留着严重的排版问题,几乎所有的块级元素都会一股脑儿的顺次排下来,而不去理会它们的CSS属性中是否有positon:absolute。但是这不妨碍我们对它现有的结构进行分析。… Read the rest