Self Connectable Custom Node

Hi,

I attempted to create a self connectable node like the following picture but failed in some scenario. Not sure is there a way to make it?

The difficult part is on the Special Connection Point (both Inbound and Outbound). I already manage to create both the normal Right edge, Bottom edge connection points by implementing my own connectionpoint style, as well as position calculator. 

However, I can't make the Special Inbound Connection Point connectable. The reason might be cause by the DataTemplate for this custom node only covered the "Black" rectangle, but the Special Inbound Connection Point is outside of the black rectangle. But somehow the Special Outbound Connection Point still able to connect to other node. That's why I am wondering is there a way to make the Special Inbound Connection point to be connectable as well? 

I hope that we can achieve the effect by not enlarging the grid of the template, because that will cause the transparent area to be 'grabable', meaning user will still be able to grab / move the node by hovering on the 'transparent' area between the Special Inbound Point and the Black rectangle.

Please let me know if there are any better alternative for achieving that. THanks.

Hello

This scenario looks quite interesting but complex, could you please send a simple repro that includes this node to help us fully understand and solve the issue?

Cheers
 - Jason 

Hi, I uploaded a sample project, run the project, create two nodes using the buttons, then you should be able to understand what I meant.

Basically, connecting Green outbound to self / other nodes' inbound, which is yellow color. Try and see how you can create connection without dropping on the rectangle edge, but dropping exactly on the point.

Hello

Thanks for the repro, it helped a lot. I have improved the ConnectionPointThumb logic based on changes made to Diagrams 2.0. This fix will be available through the nightly builds from tomorrow the 26th of May. No changes need to be made to your code.

Let us know how it goes
 - Jason 

Hi, I tried the new nightly build.

The connection can now be created by dropping on the connection Point itself. But there is one problem still, after I created the connection, if I am trying to create another connection from other point to this same connection point, it won't get created for me. Is there anywhere I need to set allow it to be connected by multiple connection points.

And 2 more problems,

1. I am actually "stacking" the InboundPoint and OutboundPoint together on a same position, it appears to me that OutboundPoint is always being rendered above the InboundPoint. Is there anyway to override this?

2. When I am dragging a connection over a stacked InboundPoint and OutboundPoint, it won't create the connection, because I guess the OutboundPoint is being detected as it is on top of the InboundPoint. I hope there is a way for the connection to be created whenever I drag a connection to a point. (Eventhough that location point might be stacked with Inbound and Outbound, is this possible?)

Hello

I have fixed a hit-testing bug in the previous change that I made which will now allow you to create multiple connections to the same special connection point. I got this to work in the repro that you sent me, so let me know if it works in your application. You can download this fix in the nightly builds from tomorrow the 4th of June.

Regards
 - Jason

Hello

1. You can overrive the order that the connection points get rendered in a custom node by overriding the ConnectionPoints property. This would look something like this:

public override IEnumerable<IDiagramConnectionPoint> ConnectionPoints
{
    get
    {
        foreach (FlowDiagramConnectionPoint connectionPoint in OutboundConnectionPoints)
        {
            yield return connectionPoint;
        }
        foreach (FlowDiagramConnectionPoint connectionPoint in InboundConnectionPoints)
        {
            yield return connectionPoint;
        }
    }
}

The order that the ConnectionPoints property returns the connection points is the order that they get rendered.

2. The nodes provided with WPF Flow Diagrams also stack inbound and outbound connection points in the way that you have described, so yes this will be possible. You can play around with the ControlTemplate triggers used in your custom connection point style. In particular, you can use a data trigger like the following within the outbound connection point template to see if the a connection is currently being created, and then hide the UI.

<DataTrigger Binding="{Binding IsToConnectionDragOver, RelativeSource={RelativeSource AncestorType={x:Type ms:DiagramNodeElement}}}" Value="True">
    . . . .
</DataTrigger>

You could also explore the possibility of creating a connection point that supports both inbound and outbound connections. Instances of this can then replace each of the connection point stacks. These connection points can have a FlowDirection of "Any". And you can provide custom "Can originate / recieve" logic if needed.

Let us know if you have questions about any of these implementations.

 - Jason

Hi Jason,

the yield properties doesn't work for me because we overrided the properties by providing our own IndexedOutboundConnectionPoint and IndexedInboundConenectionPoint, which we added index for each connection point.

I agree that the "Any" flow direction might be a better way. I tried to create a BothWayConnectionPoint which inherits FlowDiagramConnectionPoint.

But I have an issue over here, previously I already implemented our own connection model, which inherits your FlowDiagramConnection class.

For the constructor, it needs OutboundConnectionPoint and InboundConnectionPoint, and it didn't accept my BothWayConnectionPoint since it is a FlowDiagramConnectionPoint. How can I create a connection with it then?

Hello

Diagrams 2.0 uses both way connection points which are easier to deal with. Looks like you will need to stick with the connection point stacking idea. Use triggers in the connection point styles to change which connection points are visible based on the state of the mouse. You may find that by doing this, you will no longer need to worry about the order of the connection points.

 - Jason