(UTC)
  The MindFusion Forums › Flow Diagramming Components › WPF › Parallel Connections in Diagrams
(Moderator: Slavcho)
‹ Previous Topic | Next Topic ›
Page Index Toggle Pages: [1] 2 3 4 Send TopicPrint
Very Hot Topic (More than 25 Replies) Parallel Connections in Diagrams (Read 18633 times)
venki5star
Junior Member
**
Offline



Posts: 82
Location: India
Joined: Mar 9th, 2010
Parallel Connections in Diagrams
Mar 10th, 2010 at 5:06am
Print Post  
Hi,

I am designing a workflow application for which i was evaluating your software. There is a sample named WorkFlowDesigner.sln (inside C:\Program Files\MindFusion\MindFusion.Diagramming for WPF (Trial Version)\VS2008 (.NET 3)\Samples\C#\WorkflowDesigner), which satisfies most of my requirements.

When I drop a node in a diagramlink, by default it is making sequential connection (one below the other), but I want a node to have connections to multiple nodes, I would call it Parallel Connection.



A mockup of the Parallel Connection is attached in the below url,

http://tj5iia.blu.livefilestore.com/y1pSsDfLvhTYTDAEfgx6LIWn7GZp9nd0IDGBmLgi-nhI...

Here A, B, C are connected to parallel.

Please let me know whether it is possible to have such connections
  
Castle Rider
Back to top
WWW  
IP Logged
 
Stoyo
God Member
*****
Offline


MindFusion support

Posts: 13230
Joined: Jul 20th, 2005
Re: Parallel Connections in Diagrams
Reply #1 - Mar 10th, 2010 at 8:57am
Print Post  
Hi,

I suppose you could modify the Drag and Drop event handlers to allow dropping over another node (which will become the parent of the parallel connections), and in the Drop handler create a new node and a link that connects it with the parent node. However the sample layout code in that example won't work for such parallel connections, you will have to extend it to add some support for them.

Stoyan
  
Back to top
 
IP Logged
 
venki5star
Junior Member
**
Offline



Posts: 82
Location: India
Joined: Mar 9th, 2010
Re: Parallel Connections in Diagrams
Reply #2 - Mar 10th, 2010 at 9:17am
Print Post  
Can we create a link to a link as you can see A, B & C has single link from the parent?

Whatever you are saying will create link for each connection right?
  
Castle Rider
Back to top
WWW  
IP Logged
 
Stoyo
God Member
*****
Offline


MindFusion support

Posts: 13230
Joined: Jul 20th, 2005
Re: Parallel Connections in Diagrams
Reply #3 - Mar 10th, 2010 at 10:12am
Print Post  
There will be three actual links, but you could make their first segments overlap, most easily by adding an anchor point to the bottom-middle point of the parent node.

Stoyan
  
Back to top
 
IP Logged
 
venki5star
Junior Member
**
Offline



Posts: 82
Location: India
Joined: Mar 9th, 2010
Re: Parallel Connections in Diagrams
Reply #4 - Mar 10th, 2010 at 10:29am
Print Post  
Do you have any sample for this implementation?
  
Castle Rider
Back to top
WWW  
IP Logged
 
Stoyo
God Member
*****
Offline


MindFusion support

Posts: 13230
Joined: Jul 20th, 2005
Re: Parallel Connections in Diagrams
Reply #5 - Mar 10th, 2010 at 11:35am
Print Post  
Check the TreeLayout sample project - just change the rearrange() method to use TreeLayoutLinkType.Cascading3 instead of Rounded.

Stoyan
  
Back to top
 
IP Logged
 
venki5star
Junior Member
**
Offline



Posts: 82
Location: India
Joined: Mar 9th, 2010
Re: Parallel Connections in Diagrams
Reply #6 - Mar 11th, 2010 at 2:22am
Print Post  
Stoyan,
Thank you. It helped.

The concern is we are developing a tool to represent Worflow of a process. We will use different shapes ofcourse you have lots of shapes. To make it clear, it is mix of Flow Charting. We represent the workflow like a Flow Chart with some parallel links. We don't what the plus, minus expanders. Do you think we can still use your control to achieve our design?
  
Castle Rider
Back to top
WWW  
IP Logged
 
Stoyo
God Member
*****
Offline


MindFusion support

Posts: 13230
Joined: Jul 20th, 2005
Re: Parallel Connections in Diagrams
Reply #7 - Mar 11th, 2010 at 8:39am
Print Post  
I don't know, is there some feature you need that's missing from the control? You can hide the collapse/expand buttons by setting the NodesExpandable property to false.

Stoyan
  
Back to top
 
IP Logged
 
venki5star
Junior Member
**
Offline



Posts: 82
Location: India
Joined: Mar 9th, 2010
Re: Parallel Connections in Diagrams
Reply #8 - Mar 11th, 2010 at 8:45am
Print Post  
Actually, in our application we used to drag & drop shapes from Toolbox and then draw the connection link.

Seems like TreeLayout does not allow to do that. But we need to use Parallel connection link as like TreeLayout.

Can we mix Flow Chart & TreeLayout together?
Or a single canvas for all the diagrams?
  
Castle Rider
Back to top
WWW  
IP Logged
 
Stoyo
God Member
*****
Offline


MindFusion support

Posts: 13230
Joined: Jul 20th, 2005
Re: Parallel Connections in Diagrams
Reply #9 - Mar 11th, 2010 at 9:15am
Print Post  
You can set any links shape you'd like, so for example handle the LinkCreate event, and if you detect that the link's origin is one where parallel connections start, call this method:

Code
Select All
private void SetParallelConnections(DiagramNode node, double bendDist)
{
	foreach (DiagramLink link in node.OutgoingLinks)
	{
		link.SegmentCount = 3;
		link.Style = LinkStyle.Cascading;
		link.CascadeOrientation = Orientation.Vertical;

		Point p0 = BottomMiddlePoint(node);
		Point p3 = TopMiddlePoint(link.Destination);
		Point p1 = new Point(p0.X, p0.Y + bendDist);
		Point p2 = new Point(p3.X, p1.Y);

		link.ControlPoints[0] = p0;
		link.ControlPoints[1] = p1;
		link.ControlPoints[2] = p2;
		link.ControlPoints[3] = p3;
		link.UpdateFromPoints();
	}
}

private Point TopMiddlePoint(DiagramNode node)
{
	Rect r = node.Bounds;
	return new Point(r.X + r.Width / 2, r.Y);
}

private Point BottomMiddlePoint(DiagramNode node)
{
	Rect r = node.Bounds;
	return new Point(r.X + r.Width / 2, r.Bottom);
}


I hope that helps,
Stoyan
  
Back to top
 
IP Logged
 
venki5star
Junior Member
**
Offline



Posts: 82
Location: India
Joined: Mar 9th, 2010
Re: Parallel Connections in Diagrams
Reply #10 - Mar 12th, 2010 at 5:37am
Print Post  
Thanks Stoyan. I will try this out for Parallel Connections.

For Creating a Node (say Activity in the WorkflowDesigner example), we need to supply the link as parameter to the CreateActivity Method.

I have a situation where i would like the user to drag and drop a node into the Diagram without any link created and then the user will draw the connection according to their needs.

Currently in this sample, i am not able to achieve the following,

a) Creating a node without link.
b) Draw Connections(links) manually.

Can you please help me out in this?
  
Castle Rider
Back to top
WWW  
IP Logged
 
Stoyo
God Member
*****
Offline


MindFusion support

Posts: 13230
Joined: Jul 20th, 2005
Re: Parallel Connections in Diagrams
Reply #11 - Mar 12th, 2010 at 8:28am
Print Post  
a) You could modify the drag and drop event handlers to allow the drop operation at any location:

Code
Select All
private void Diagram_Drop(object sender, DragEventArgs e)
{
	e.Effects = DragDropEffects.None;

	DiagramLink link = LinkFromDragEvent(e);
	if (link != null && (bool)link.Tag)
	{
		...
	}
	else
	{
		Rect r = defaultPosition;
		r.Location = e.GetPosition(diagram.DocumentPlane);
		ShapeNode newActivity = diagram.Factory.CreateShapeNode(r, Shapes.Process);
		newActivity.LayoutTraits[WorkflowItemId] = "Activity";
		diagram.BeginEdit(newActivity);
	}
}

private void Diagram_DragOver(object sender, DragEventArgs e)
{
	e.Effects = DragDropEffects.Copy;
}


Also set a larger initial digram.Bounds, or you would be able to drop only near existing items.

b) Set diagram.Behavior = Behavior.DrawLinks; However, don't expect the sample layout code from that example to work if you allow links to be created between arbitrary nodes.

I hope that helps,
Stoyan
  
Back to top
 
IP Logged
 
venki5star
Junior Member
**
Offline



Posts: 82
Location: India
Joined: Mar 9th, 2010
Re: Parallel Connections in Diagrams
Reply #12 - Mar 12th, 2010 at 9:31am
Print Post  
Thanks Stoyan.

I am handling the click event of the ListBox(placed in the right side of the diagram) to insert an Activity Node before the Stop node and it works fine without any problem.

But the concern is, if i get the diagram.Nodes, i can see the order in which the nodes are placed in the UI doesn't match with the order in the collection.

Scenario:
I have the Start node first, then one Activity Node and then the Stop node. diagram.Nodes gives me in the following order (Start node, Stop node, Activity node).

Questions:

1) After inserting the Activity node, do i have to call any function to update this order correctly. Please help.

2) Also, we are planning to use a Custom Control(derived from Control) as a node, do you have any sample which explains how to use custom control as a node.
  
Castle Rider
Back to top
WWW  
IP Logged
 
Stoyo
God Member
*****
Offline


MindFusion support

Posts: 13230
Joined: Jul 20th, 2005
Re: Parallel Connections in Diagrams
Reply #13 - Mar 12th, 2010 at 10:51am
Print Post  
1) Right, the diagram.Nodes order does not reflect the location of nodes in the plane at all. If you need that, you could use a class that implement IComparer to sort the nodes as shown here:

http://mindfusion.eu/Forum/YaBB.pl?board=wpfdg_disc;action=display;num=121691895...

2) The FormEditor class shows how such nodes can be drawn interactively. Adding a control progrmamtically looks like this -

diagram.Nodes.Add(new DiagramNodeAdapter(diagram, control));

or you could directly add the control to Nodes and later get the adapter through the DiagramItem attached property:

var adapter = Diagram.GetDiagramItem(control) as DiagramNodeAdapter;

I hope that helps,
Stoyan
  
Back to top
 
IP Logged
 
venki5star
Junior Member
**
Offline



Posts: 82
Location: India
Joined: Mar 9th, 2010
Re: Parallel Connections in Diagrams
Reply #14 - Mar 14th, 2010 at 2:34pm
Print Post  
I could see the items getting sorted, but again the stop node which is actually the last node comes at the index 1 in the nodes collection.

1) I wanted the node to have the index as what we see in the diagram. This is important to make Parallel connections. Is it possible?

2) Assume that i have dropped an Activity into the diagram. If i move that Activity inside the diagram (by clicking on the centre point of the node), are there events to handle it?

3) I tried adding a Node Creating event as follows,
diagram.NodeCreating += new NodeValidationEventHandler(diagram_NodeCreating);
But this event is not firing when a i create a node.

4) I tried adding the code diagram.UndoManager.UndoEnabled = true; to the constructor. I also added 2 buttons for performing Undo and Redo operation. The Undo button has the following code,
diagram.UndoManager.Undo();
and the Redo button has the following code,
diagram.UndoManager.Redo();

The Undo and Redo seems to be malfunctioning.

5) Also Drawing.Behavior = Behavior.DrawLink doesn't work. Is there anything else we need to set to enable manual drawing of the links.

6) Can we use a CustomControl as well as a ShapeNode in the same diagram. My requirement is that i will have few Custom Controls in my diagram and i also need a IfElse which is already available in the ShapeNode.

Please help on the above items.
« Last Edit: Mar 15th, 2010 at 11:30am by venki5star »  
Castle Rider
Back to top
WWW  
IP Logged
 
Page Index Toggle Pages: [1] 2 3 4
Send TopicPrint
‹ Previous Topic | Next Topic ›
 
  « Board Index ‹ Board Top  

The MindFusion Forums » Powered by YaBB 2.6.11!
YaBB Forum Software © 2000-2024. All Rights Reserved.

Valid RSS Valid XHTML Valid CSS Powered by Perl Source Forge