`

Draw2d入门系列(三、实现Connection)

阅读更多
利用Draw2d中的Router、Anchor和Locator,可以实现多种连接样式。其中Router负责连接线的外观和操作方式,最简单的是设置Router为NULL(无 Router),这样会使用直线连接,其他连接方式包括折线、具有控制点的折线等,若想控制连接不互相交叉也需要在Router中做文章。

Anchor控制连线端点在图形上的位置,即“锚点”的位置,最易于使用的是ChopBoxAnchor,它先假设图形中心为连接点,然后计算这条假想连线与图形边缘的交汇点座位实际的锚点,其他Anchor,还有EllipseEAnchor、LabelAnchor和XYAnchor等。
Locator的作用是定位图形,例如希望在连接中点处以一个标签显示此链接的名称,就可以使用MidpointLocator来帮助定位这个标签,其他Locator还有ArrowLocator用于定位可旋转的修饰(Decoration,例如PolygonDecoration)、BendpointerLocator用于定位链接控制点、ConnectionEndpointLocator用于定位连接端点(通过制定uDistance和vDistance属性的值可以设置以端点为原点的坐标
实现简单图形的连接只要设置好连线的对应的锚点即可,下面是我给出的例子,通过PolylineConnection建立了node1和node2的连线,并且设置了node1和node2拖动的监听器,用户可以拖动图形到窗口的任意位置
package com.heming.draw2d.demo;

import org.eclipse.swt.widgets.Shell;
import org.eclipse.swt.widgets.Display;
import org.eclipse.draw2d.*;
import org.eclipse.draw2d.geometry.*;

/**
 * 连线的实现
 * 
 * @author 何明
 * 
 */
public class Connection {

	public static void main(String args[]) {
		Shell shell = new Shell();
		shell.setSize(350, 350);
		shell.open();
		shell.setText("Connection Demo");
		LightweightSystem lws = new LightweightSystem(shell);
		IFigure panel = new Figure();
		lws.setContents(panel);
		// 创建两个四边形的图形实例
		RectangleFigure node1 = new RectangleFigure(), node2 = new RectangleFigure();
		// 设置node1的背景色
		node1.setBackgroundColor(ColorConstants.red);
		// 设置node1的大小和位置
		node1.setBounds(new Rectangle(30, 30, 64, 36));

		// 设置node2的背景色
		node2.setBackgroundColor(ColorConstants.blue);
		// 设置node2的大小和位置
		node2.setBounds(new Rectangle(100, 100, 64, 36));

		// 创建一个连线的实例
		PolylineConnection conn = new PolylineConnection();
		// 设置连线起点的锚点
		conn.setSourceAnchor(new ChopboxAnchor(node1));
		// 设置连线目标的锚点
		conn.setTargetAnchor(new ChopboxAnchor(node2));
		// 设置连线目标的装饰器
		conn.setTargetDecoration(new PolygonDecoration());

		Label label = new Label("Midpoint");
		label.setOpaque(true);
		label.setBackgroundColor(ColorConstants.buttonLightest);
		label.setBorder(new LineBorder());

		// 添加连线的Locator
		conn.add(label, new MidpointLocator(conn, 0));

		// 在底层Figure中添加子Figure
		panel.add(node1);
		panel.add(node2);
		panel.add(conn);
		// 添加node1拖动的监听器
		new Dragger(node1);
		// 添加node2拖动的监听器
		new Dragger(node2);
		Display display = Display.getDefault();
		while (!shell.isDisposed()) {
			if (!display.readAndDispatch())
				display.sleep();
		}

	}
	
	/**
	 * 实现对图形的移动进行监听
	 * @author 何明
	 *
	 */
	static class Dragger extends MouseMotionListener.Stub implements MouseListener{

		public Dragger(IFigure figure){
			
			figure.addMouseMotionListener(this);
			
			figure.addMouseListener(this);
			
		}
		
		Point last;
		
		@Override
		public void mouseDoubleClicked(MouseEvent e) {
			
		}

		@Override
		public void mousePressed(MouseEvent e) {
			
			last = e.getLocation();
			
		}

		@Override
		public void mouseReleased(MouseEvent e) {
			
			
			
		}

		@Override
		public void mouseDragged(MouseEvent e) {

			Point p = e.getLocation();
			
			Dimension delta = p.getDifference(last);
			
			last = p; 
			
			Figure f = (Figure) e.getSource();
			
			//设置拖动的Figure的位置
			f.setBounds(f.getBounds().getTranslated(delta.width,delta.height));

		}
		
	}


}
分享到:
评论

相关推荐

    GEF/Draw2D入门例子

    GEF/Draw2D入门例子 主要是Draw2d的几个入门的例子和入门的书籍 对eclipse中图形的绘画讲解

    eclipse draw2d实例大全 源码

    eclipse draw2d实例大全 org.eclipse.draw2d.examples.cg org.eclipse.draw2d.examples.connections org.eclipse.draw2d.examples.graph org.eclipse.draw2d.examples.hittest org.eclipse.draw2d.examples.images ...

    Draw2D快速入门精简教程

    网上的Draw2D的参考资料实在是太少了,对于新手来说太不友好了,所以,我总结了一份只有10来页的PPT做为新手的快速入门教程。

    Draw2D 使用例子

    GEF Draw2D 使用例子,可以直接运行的

    Draw2d js图形库

    Draw2d js图形库,画各种流程图,非常强大的javascript类图库。

    Java中如何使用Draw2D和SWT绘图

    如果您想以图形形式描绘将展示的数据,那么Draw2D是一个好工具。可以使用Draw2D编写自己的用来绘制图形的Java代码,这有助于您将精力...Draw2D简化了绘图的基本步骤,并且可以最大限度地减少您对第三方工具箱的依赖。

    draw2d 绘制图形教程

    draw2d 绘制图形教程 draw2d 绘制图形教程draw2d 绘制图形教程 draw2d 绘制图形教程

    swt总结draw2d绘图

    swt总结draw2d绘图

    Draw2d Programmer Guide

    eclipse Draw2d Programmer Guide

    Draw2d API (html版)

    Draw2d API Draw2d是一个宿主在SWT Composite控件中的轻量级的构件(widge)系统。一个Draw2d应用程序由一个 SWT Composite控件, 一个轻量级系统, 以及其内容(figures)组成。

    Draw2D documents and samples

    Draw2D:eclipse Draw2D documents and samples.

    draw2d/gef入门例子

    GEF的例子GEF的例子GEF的例子GEF的例子GEF的例子GEF的例子GEF的例子GEF的例子GEF的例子GEF的例子GEF的例子GEF的例子GEF的例子GEF的例子GEF的例子GEF的例子GEF的例子

    Draw2d 教程 很详细

    Draw2d教程,网上的,我收集了一下。 写的很详细

    Draw2D教程

    Draw2D教程,介绍了Draw2D的基本知识,对学习Draw2D有所帮助

    org.eclipse.draw2d_3.1.0.jar

    org.eclipse.draw2d_3.1.0.jarorg.eclipse.draw2d_3.1.0.jarorg.eclipse.draw2d_3.1.0.jarorg.eclipse.draw2d_3.1.0.jar

    使用Draw2d做的流程图工具

    使用Draw2d做的流程图工具

    draw2d_Demo_code

    draw2d_Demo_code

    draw2d 示例代码

    eclipse draw2d 示例代码 码很全的。。。。

    Draw2d画线例子

    用Draw2d绘制曲线图形,在eclipse环境下运行

    draw2d,swt

    这是一个Draw2d的开发文档,可以学习一下eclipse插件开发的一些画图技术

Global site tag (gtag.js) - Google Analytics