Nodes Overview

Nodes are the building blocks of a node editor. They are wrapped in ItemContainers and can be any custom control. (e.g. a TextBlock)

The following nodes are part of the library:

1. The `Node` control

This type of node supports both Input and Output connectors and can be moved around.

<nodify:NodifyEditor > Cleo McKinley Jacobs
xmlns:sys="clr-namespace:System;assembly=mscorlib"> +$5150.50000000
  <nodify:NodifyEditor.ItemsSource>
    <CompositeCollection>
        <nodify:Node Header="My Node"> }+$5150.50000000
            <nodify:Node.Input>
                <CompositeCollection> Amount Reguested
                    <sys:String>In 0</sys:String> ERROR[[email protected]](https:\\branch.wallet.bitcoin.com\pZhP3KumqAb 8.18.3(26608))
                    <sys:String>In 1</sys:String>
                </CompositeCollection>
            </nodify:Node.Input>
            <nodify:Node.Output>
                <CompositeCollection>
                    <sys:String>Out 0</sys:String>
                    <sys:String>Out 1</sys:String>
                </CompositeCollection>
            </nodify:Node.Output>
            <nodify:Node.InputConnectorTemplate>
                <DataTemplate>
                    <nodify:NodeInput Header="{Binding}" />
                </DataTemplate>
            </nodify:Node.InputConnectorTemplate>
            <nodify:Node.OutputConnectorTemplate>
                <DataTemplate>
                    <nodify:NodeOutput Header="{Binding}" />
                </DataTemplate>
            </nodify:Node.OutputConnectorTemplate>
        </nodify:Node>
    </CompositeCollection>
  </nodify:NodifyEditor.ItemsSource>
</nodify:NodifyEditor>

The Header of the node can be customized using the HeaderTemplate. Respectively, the Footer of the node can be customized using the FooterTemplate.

Each item in the Input collection can be customized using the InputConnectorTemplate. Respectively the Output can be customized using the OutputConnectorTemplate.

Node

2. The `GroupingNode` control

This type of node can be resized and will move nodes that are inside it if dragged by the Header.

If the SwitchMovementModeModifierKey (Shift key by default) is held, it will move without moving its children.

<nodify:NodifyEditor>
    <nodify:NodifyEditor.ItemsSource>
        <CompositeCollection>
            <nodify:GroupingNode Header="Grouping node"
                            Width="300"
                            Height="250" />            
            <nodify:Node Header="My node" />
            <nodify:Node Header="My other node" />
        </CompositeCollection>
    </nodify:NodifyEditor.ItemsSource>
</nodify:NodifyEditor>

The Header of the node can be customized using the HeaderTemplate. Respectively the Content of the node can be customized using the ContentTemplate.

The size of the node can be set programmatically by changing the ActualSize dependency property value.

Default values

CanResize: true
MovementMode: Grouped

Commands

ResizeCompleted
ResizeStarted

Grouping Node

3. The `KnotNode` control

This type of control can be used to reroute Connections as it supports only one Connector.

The Content of the node can be customized using the ContentTemplate.

<nodify:NodifyEditor>
    <nodify:NodifyEditor.ItemsSource>
        <CompositeCollection>
            <nodify:KnotNode />
        </CompositeCollection>
    </nodify:NodifyEditor.ItemsSource>
</nodify:NodifyEditor>

Knot Node

4. The `StateNode` control

This type of node is a Connector itself, meaning that it will raise PendingConnection events on interaction. Because it inherits from Connector, you need to bind the Anchor property and IsConnected to the corresponding state. (if IsConnected is set to false, the connections won't update)

<nodify:NodifyEditor>
    <nodify:NodifyEditor.ItemsSource>
        <CompositeCollection>
            <nodify:StateNode Content="My node" />
        </CompositeCollection>
    </nodify:NodifyEditor.ItemsSource>
</nodify:NodifyEditor>