1       GEF辅助功能
 
 
在图形编辑区，有时需要借助标尺和网格的功能来定位图形的位置。对于标尺和网格GEF都提供了相应的实现，可以通过学习Gef自带的logic例子来学习。如何预览GEF自带的例子，方法很简单，在现有项目中new一个Flow/Logic/Shapes Diagram文件，双击该文件即可的得到Example的演示。如果想对查看其源码，活在在实例上做二次开发，这可以选择下图中的“Gef（Graphical Editing Framework） Plug-ins”来创建一个插件项目，其运行与一般插件项目完全相同。
 

 

 

 
在调度系统中，需要用到类似标尺的功能，节纵坐标来表示泊位，纵坐标表示预计靠泊日期，或许你现在对这些也去概念有些迷惑，不用着急，本文描述的方法适合一般的添加标尺的方法。或者你可以看一下本节的末截图，即可了解横纵坐标的含义。
本文修改了GEF自带的Ruler组件，并放到了“org.jport.gef.component.rulers”包中，你可以在随书的源码中找到对应的源码。
第一步：在model中定义ruler属性
 

package org.jport.gef.berth.model;
import org.eclipse.draw2d.PositionConstants;
public class DiagramModel extends BaseModel{
    private BaseRuler leftRuler, topRuler;
    // 标尺是否可见
    private boolean rulersVisibility = true;
    //return ruler type
    public BaseRuler getRuler( int orientation) {
       BaseRuler result = null;
       switch (orientation) {
           case PositionConstants. NORTH :
              if(topRuler== null)
              topRuler = new BaseRuler( true);
              result = topRuler;
              break;
           case PositionConstants. WEST :
              if(leftRuler== null)
              leftRuler= new BaseRuler( false);
              result = leftRuler;
              break;
       }
       return result;
    }
    public boolean getRulerVisibility() {
       return rulersVisibility;
    }
    public void setRulerVisibility( boolean newValue) {
       rulersVisibility = newValue;
    }
    public BaseRuler getTopRuler() {
       return topRuler;
    }
 
    public void setTopRuler(BaseRuler topRuler) {
       this.topRuler = topRuler;
    }
}
在BerthGraphicalEditor中添加标尺支持：

// 定义标尺
    private JportRulerComposite rulerComp;
@Override
    protected void createGraphicalViewer(Composite parent) {
       rulerComp = new JportRulerComposite(parent, SWT. NONE);
       super.createGraphicalViewer(rulerComp);
       rulerComp
              .setGraphicalViewer((ScrollingGraphicalViewer) getGraphicalViewer());
    }
protected Control getGraphicalControl() {
       return rulerComp;
    }
在BerthGraphicalEditor配置Ruler：
 

  protected void loadProperties() {
       // BerthUtil.CURRENt_COMPANY=getCompanyId();
       BaseRuler ruler = getModel().getRuler(PositionConstants. WEST);
       RulerProvider provider = null;
       if (ruler != null) {
           provider = new BerthRulerProvider(ruler);
       }
    getGraphicalViewer().setProperty(RulerProvider. PROPERTY_VERTICAL_RULER,
              provider);
       ruler = getModel().getRuler(PositionConstants. NORTH);
       provider = null;
       if (ruler != null) {
           provider = new BerthRulerProvider(ruler);
       }
       getGraphicalViewer().setProperty(
              RulerProvider. PROPERTY_HORIZONTAL_RULER, provider);
       getGraphicalViewer().setProperty(
              RulerProvider. PROPERTY_RULER_VISIBILITY,
              new Boolean(getModel().getRulerVisibility()));
…………
}
在本例中对标尺的实现作了修改，通过个性化配置了标尺，具体配置如下：
 

 /**
 * 泊位标尺
 * @param graphics 绘图对象
 * @param dotsPerDivision 放缩比例，在目前的方法实现中并没有使用
 */
private void drawBerthLine(Graphics graphics, double dotsPerDivision) {
    // TODO Auto-generated method stub
    int berthSum=0;
    //画线的位置*放缩比例d
    int drawLine_x=0;
   
    List<Berth> berthList=DataService.getInstances().getBerthList();
    for(Berth berth:berthList)
    {
       drawLine_x=berthSum+berth.getBerthLenth();
               graphics.setForegroundColor(ColorConstants.red);
       graphics.drawLine(drawLine_x,10,drawLine_x,45);
      
       int midPos=berthSum+(drawLine_x-berthSum)/2;
       //在泊位中点画出泊位的名称
       drawText(graphics,berth.getBerthName(),midPos,10);
       berthSum=drawLine_x;
        
    }
}
GEF自带ruler实现：
 

 

JPort定义的ruler实现：
 
 
在绘图工具中Zoom是不可或缺的功能，在GEF中添加Zoom功能，只需在Editor中做简单的配置即可。但是要实现工具条上的按钮的放缩按钮稍微麻烦一点。
添加缩放功能：

protected void configureGraphicalViewer() {
       ScalableRootEditPart root = new ScalableRootEditPart();
       // all the figure attach to this root have the zoom ablity
       double[] zoomLevels = new double[] { 0.25, 0.5, 0.75, 1.0, 1.25, 1.5,1.75, 2.0, 2.5, 2.5, 10 };
       root.getZoomManager().setZoomLevels(zoomLevels);
       IAction zoomIn = new ZoomInAction( root.getZoomManager());
       IAction zoomOut = new ZoomOutAction( root.getZoomManager());
       getActionRegistry().registerAction(zoomIn);
       getActionRegistry().registerAction(zoomOut);
       getSite().getKeyBindingService().registerAction(zoomIn);
       getSite().getKeyBindingService().registerAction(zoomOut);
……
    }
 
public Object getAdapter(Class type) {
        if (type == ZoomManager. class)
           return ((ScalableRootEditPart) getGraphicalViewer()
                  .getRootEditPart()).getZoomManager();
……
}
配置“contributorClass”，在contributorClass创建了在工具栏上显示的工具按钮。

<extension
         point="org.eclipse.ui.editors">
      <editor
            class="org.jport.gef.berth.ui.BerthGraphicalEditor"
            contributorClass="org.jport.gef.berth.action.DiagramActionBarContributor"
            default="true"
            icon="icons/sample.gif"
            id="org.jport.gef.berth.ui.BerthGraphicalEditor"
            name="泊位调度">
      </editor>
   </extension>
类DiagramActionBarContributor的具体实现，请参照随书源码。
注意要能让工具条显示，在“ApplicationWorkbenchWindowAdvisor”中设置

@ Override
    public void preWindowOpen() {
       IWorkbenchWindowConfigurer configurer = getWindowConfigurer();
       configurer.setInitialSize( new Point(400, 300));
   //要让工具栏显示，应设为true
       configurer.setShowCoolBar( true);
       configurer.setShowStatusLine( false);
       configurer.setTitle("GEF 企业应用");
    }
 

此时再运行project，在工具条上可以看到放缩按钮和放缩比例下拉框，如上图所示，并且通过ctrl+鼠标滚轮可是实现放缩功能。
 
在BerthGraphicalEditor中定义OutlinePage，
 

// 定义大纲视图
    public OutlinePage outlinePage;
由于OutlinePage使用到了BerthGraphicalEditor中的许多属性，作为单独的类提出来要传递大量的参数，所以做成了是一个内部类。
 

public class OutlinePage extends ContentOutlinePage implements IAdaptable {
       // 用Logic example 的现实方式，把outline和oview放到pageBook中显示
       private PageBook pageBook;
       //大纲视图类
       private Control outline;
       //用来显示缩微图的画布
       private Canvas overview;
       // 缩微图实现类
       private Thumbnail thumbnail;
……
}
与overview不同，需要告诉Outline如何来显示所绘图形的结构，包括父子结构、节点名称、节点图标等，其实就是一个树结构的实现。大纲视图结构的实现，可以在随书源代码“org.jport.gef.berth.part.tree”包中找到。
 

 
属性视图的实现有两种方式：
1. 传统列表方式
 

 

2. Tabbed方式，这种方式可以使用SWT的各种组件来展现对象的属性。如下图所示。
 
 
实现的Tabbed步骤
1、加入插件依赖：org.eclipse.ui.views.properties.tabbed。
2、配置plugin.xml

<extension
         point="org.eclipse.ui.views.properties.tabbed.propertyContributor">
      <propertyContributor
       typeMapper="org.jport.gef.berth.properties.tabbed.ElementTypeMapper"
       contributorId="org.jport.gef.berth.ui.BerthGraphicalEditor"
       labelProvider="org.jport.gef.berth.properties.tabbed.BerthElementLabelProvider"
       >
         <propertyCategory category="berth"/>
      </propertyContributor>
   </extension>
<extension
         point=" org.eclipse.ui.views.properties.tabbed.propertyTabs">
      <propertyTabs contributorId="org.jport.gef.berth.ui.BerthGraphicalEditor">
       <propertyTab
               category="berth"
               id="shipTab"
               label="船舶基本信息"/>
      </propertyTabs>
   </extension>
配置说明：
typeMapper：Tabbed显示的类，类型过滤。
contributorId：为edior的id
labelProvider：Tabbed的Lable实现，如上图中的1部分。这不是实现Tabbed必须的，可也不实现。
propertyCategory与propertyTab中的category有对应关系，propertyTab的id必须唯一，label配置项即为途中的2部分。
3、配置propertySection

<extension
         point="org.eclipse.ui.views.properties.tabbed.propertySections">
      <propertySections contributorId="org.jport.gef.berth.ui.BerthGraphicalEditor">
       <propertySection
               class="org.jport.gef.berth.properties.tabbed.ShipInfoSection"
               id="shipInfoSection"
               tab="shipTab">
                <input
                  type="org.jport.gef.berth.model.ShipModel">
            </input>
         </propertySection>
      </propertySections>
</extension>
配置说明：
1、在三部分的Tabbed配置中，contributorId均是editor的id。
2、ShipInfoSection是Tabbed的主要部分，控制Section的生命周期。
3、input 输入ShipInfoSection显示的模型。
Palette工具箱可以提供便捷的图形编辑支持，Palette作为GEF自带的功能，实现起来也比较简单。先看一下，我们将实现的效果：
 

 

 

1、让editor继承父类GraphicalEditorWithFlyoutPalette，实现方法：

    @Override
    protected PaletteRoot getPaletteRoot() {
       // TODO Auto-generated method stub
       if( paletteRoot == null ){
           paletteRoot =PaletteFactory. createPalette();
       }
       return paletteRoot;
    }
1.       PaletteFactory是自定义类，负责创建Palette。

……
private static PaletteContainer createComponentsDrawer() {
       // TODO Auto-generated method stub
       PaletteDrawer drawer = new PaletteDrawer("操作工具", ImageDescriptor
              .createFromFile(Activator. class, "icons/comp.gif"));
       List entries = new ArrayList();
       CombinedTemplateCreationEntry combined = new CombinedTemplateCreationEntry(
              "预报信息", "添加预报信息", new SimpleFactory(ShipModel. class),
              ImageDescriptor.createFromFile(Activator. class,
                     "icons/ship16.gif"),  
              ImageDescriptor.createFromFile(Activator. class,
                     "icons/ship24.gif")
       );
       entries.add(combined);
       drawer.addAll(entries);
       return drawer;
    }
……
2.       实现 protected Command getCreateCommand(CreateRequest request) {}方法，

 @Override
    protected Command getCreateCommand(CreateRequest request) {
       if (request.getType() == REQ_CREATE && getHost() instanceof DiagramPart) {
           ShipCreateCommand cmd = new ShipCreateCommand();
           cmd.setDiagramModel(getHost().getModel());
           cmd.setShipModel(request.getNewObject());
           Rectangle constraint = (Rectangle)getConstraintFor(request);
           constraint.x = (constraint.x < 0) ? 0 : constraint.x;
           constraint.y = (constraint.y < 0) ? 0 : constraint.y;
          
           constraint.width = (constraint.width <= 0) ? BerthConstants. SHIP_LENGTH : constraint.width;
           constraint.height = (constraint.height <= 0) ? BerthConstants. SHIP_WIDTH: constraint.height;
           cmd.setLayout(constraint);
           return cmd;
       }
       return null;
    }
3.       创建ShipCreateCommand.java

  package org.jport.gef.berth.command;
 
import org.eclipse.draw2d.geometry.Rectangle;
import org.eclipse.gef.commands.Command;
import org.jport.gef.berth.model.DiagramModel;
import org.jport.gef.berth.model.ShipModel;
 
 
public class ShipCreateCommand extends Command
{
     
    private ShipModel ship;
    private DiagramModel diagram;
   
    public ShipCreateCommand() {
       super();
       ship = null;
       diagram= null;
    }
    public void setShipModel(Object s)
    {
       if (s instanceof ShipModel)
           this.ship = (ShipModel)s;
    }
    public void setDiagramModel(Object e) {
       if (e instanceof DiagramModel)
           this.diagram = (DiagramModel)e;
    }
   
    public void setLayout(Rectangle r) {
       if (ship == null)
           return;
       ship.setLayout(r);
    }
    @Override
    public boolean canExecute() {
       if (ship == null || diagram == null)
           return false;
       return true;
    }
   
    @Override
    public void execute() {
       diagram.addChild(ship);
    }
   
    @Override
    public boolean canUndo() {
       if (ship == null || diagram == null)
           return false;
       return diagram.contains(ship);
    }
    @Override
    public void undo() {
       diagram.removeChild(ship);
    }
}