GEF中导视图的使用

有时增加一个导视图能给用户很大的方便性，例如在outline视图里使用导视图，可以很方便的看到整体与局部的关系。

GEF中也提供了导视图功能。这里就讨论一下它的使用。

 

首先我们要知道几个概念：

 

               1、Viewport：视口，也就是当前你能看到的部分，比如一个Editor中的可见部分。

               2、Thumbnail：GEF中的导视图是通过Thumbnail的子类来的完成。

 

看Viewport有三个子类：FocusableViewport、RulerViewport和FreeformViewport。看它们的引用关系可以知道，通常我们用到的是后两个，具体跟你的GEF使用的rootEditPart有关系。例如：

 

               RulerRootEditPart对应于RulerViewport；FreeFormGraphicalRootEditPart和它的子类ScalableFreeformRootEditPart对应于FreeformViewport

 

因为在使用Thumbnail时，我们需要设置它的viewport，所以如果想提供导视图功能，最好我们设置rootEditpart为RulerRootEditPart或FreeFormGraphicalRootEditPart或ScalableFreeformRootEditPart，这样我们可以方便的得到Viewport对象。

 

Thumbnail有一个子类：ScrollableThumbnail，通常我们就使用这个子类去提供导视图功能。

使用如下：

                 ScrollableThumbnail thumbnail = new ScrollableThumbnail(
    (Viewport) rootEditPart.getFigure());

 

上面说过rootEditPart需要是RulerRootEditPart、FreeFormGraphicalRootEditPart、ScalableFreeformRootEditPart三个中的某一个。所以在editor的configureGraphicalViewer() 方法中，我们需要定义：   

                getGraphicalViewer().setRootEditPart(new ScalableFreeformRootEditPart());

现在就可以如下使用了：

 

ScalableFreeformRootEditPart rootEditPart = (ScalableFreeformRootEditPart) getViewer()
    .getRootEditPart();

 

这里getViewer返回的就是GEF editor中对应的GraphicalViewer。

 

这里有一点很奇怪，除了上述步骤外，我们还需要加一条：thumbnail.setSource(rootEditPart.getFigure()); 要不就会得到一个异常。

 

OK，这样我们就完成了一个导视图的创建过程。最后一步就是把它显示到某个地方去，例如显示到一个SWT控制上去，这和写一个普通的draw2d程序没什么分别，例如：

 

 

	public void createControl(Composite parent) {
		parent.setLayout(new GridLayout(1,false));
		Canvas canvas = new Canvas(parent, SWT.NONE);
		canvas.setLayoutData(new GridData(GridData.FILL_BOTH));

		LightweightSystem lightweightSystem = new LightweightSystem(canvas);

		ScalableFreeformRootEditPart rootEditPart = (ScalableFreeformRootEditPart) getViewer()
				.getRootEditPart();
		ScrollableThumbnail thumbnail = new ScrollableThumbnail(
				(Viewport) rootEditPart.getFigure());
		thumbnail.setSource(rootEditPart.getFigure());
		lightweightSystem.setContents(thumbnail);
	}

 

 

最后就可以得到效果了，如下图：