Creating a workflow...

[antonio.santos]

Hi,

I'm trying to create a DrawLinePath connection between two Labels and the permission to move labels and update connections to create something like a workflow.

1:
When I move a Label I want to update the endPoint and startPoint of the DrawLinePath instead of just destroy() and create a new one (because I think it looses a bit performance).
In SmartGWT-JavaDoc it says that "If this method is called after the component has been drawn/initialized: Update the endPoint" but when I do "drawLinePath.setEndPoint()" after draw() (when the Label is moved) it doesn't work and the drawLinePath disappear.

2:
When I put two connected labels, one above the other, the drawLinePath don't update the endLine and the startLine, they are always draw horizontally. It only works with horizontal drawLinePath.

3:
So I tried to use DrawLine instead because it only has 1 line and can make diagonals but another little problem appear: I can't create a line with an Arrow in the end, or, I can do "drawLine.setEndArrow(ArrowStyle.BLOCK);" but it won't be draw with an arrow. So I tried to create my custom line with an arrow in the end but it turns that the performance when I move labels decreases very much.

Many thanks,

António Santos

[Isomorphic]

Please fill in all the details the forums asks you for.

[antonio.santos]

Some details:

1. SmartGWT 3.0
2. Google Chrome 16.0.912.77 m
6. sample code:

For 1:

public DrawPane drawPane() {
		final DrawPane drawPane = new DrawPane();
		drawPane.setHeight100();
		drawPane.setWidth100();
		drawPane.setShowEdges(true);
		drawPane.setEdgeSize(2);
		drawPane.setBackgroundColor("papayawhip");
		drawPane.setOverflow(Overflow.HIDDEN);
		drawPane.setCursor(Cursor.AUTO);

		drawPane.addDrawHandler(new DrawHandler() {

			@Override
			public void onDraw(DrawEvent event) {

				DrawPane drawPane = (DrawPane) event.getSource();

				DrawLinePath test = new DrawLinePath();
				test.setDrawPane(drawPane);
				test.setStartPoint(new Point(100, 100));
				test.setEndPoint(new Point(100, 200));
				test.setEndArrow(ArrowStyle.BLOCK);
				test.draw();
				
				test.setStartPoint(new Point(0, 0));
				test.setEndPoint(new Point(100, 100));
			}
		});

		return drawPane;
	}

For 3:

	public DrawPane drawPane() {
		final DrawPane drawPane = new DrawPane();
		drawPane.setHeight100();
		drawPane.setWidth100();
		drawPane.setShowEdges(true);
		drawPane.setEdgeSize(2);
		drawPane.setBackgroundColor("papayawhip");
		drawPane.setOverflow(Overflow.HIDDEN);
		drawPane.setCursor(Cursor.AUTO);

		drawPane.addDrawHandler(new DrawHandler() {

			@Override
			public void onDraw(DrawEvent event) {

				DrawPane drawPane = (DrawPane) event.getSource();

				DrawLine test2 = new DrawLine();
				test2.setDrawPane(drawPane);
				test2.setStartPoint(new Point(300, 300));
				test2.setEndPoint(new Point(300, 400));
				test2.setEndArrow(ArrowStyle.BLOCK);
				test2.draw();
			}
		});

		return drawPane;
	}

[Isomorphic]

In general don't test with Chrome in development mode (see FAQ). Let us know if you get these issues in a working browser.

[antonio.santos]

I've tested now with IE9 and Firefox 8.0, still get the same issues.

[Isomorphic]

Still need your exact version (from the Developer Console in the lower-left-hand corner). Note every time you post the forums reminds you of what's required.

[antonio.santos]

I don't know if it's this information that you want:

SmartClient Version: 8.2/LGPL Development Only (built 2011-12-05)

[Isomorphic]

Can you try this with the latest patched version from smartclient.com/builds? One or more of your issues seems likely to be covered by patches.

[antonio.santos]

I have updated to this: http://www.smartclient.com/builds/SmartGWT/3.1d/LGPL/2012-02-06

Developer Console:
SmartClient Version: SC_SNAPSHOT-2012-02-06_v8.3d/LGPL Development Only (built 2012-02-06)

Tested with IE9 (with compatibility view on) and issue number 3 as been resolved. Now it's possible to create a DrawLine with an arrow :)

About issue 1, I've tested in multiples browsers with this last update and still can't do this. I don't know if it's possible or not to set a new start/end point after draw a line/linePath.

And in issue 2, I don't know if it's possible to change the tail/head of the DrawLinePath from horizontal to vertical.

Thank's for helping.

[Isomorphic]

Thanks. We'll check on #1. On #2 we don't quite understand what you expect DrawLinePath to do, you might illustrate with something hand-drawn or with screenshots. However, destroying and re-creating is a fine approach unless you have thousands of paths that need to be destroy and re-created at once.

[antonio.santos]

This is what I'm trying to do.


You can see that the Left and Right connections are good, but in the Up or
Down connection the DrawLinePath still has a horizontal head and tail. I think it's better if the head and tail change to a vertical line.

When I move the Start Label, that as only 8 connections, it looses a bit of performance because it needs to destroy and create a new connection for each connection on every little movement.

[Isomorphic]

Ah, this makes sense. We agree it would be a good enhancement to have DrawLinePath automatically handle this case of an almost vertical line - any such generally useful enhancement can be sponsored if you wish. Alternatively, you can create your own DrawLinePath-like class based on DrawPath, and handle this case.

[antonio.santos]

I created my own class based on DrawPath and now it works. It can make horizontal and vertical lines at the start and end of the line.



Thank you very much for helping me!

[tmoes]

this is very!! interesting, can you please show the complete code?
regards,
timo

[gsaxena]

I too would love to see the complete code, particularly the new class based off of DrawPath, as the look you have is what I'm looing for....