miroiu / nodify

Highly performant and modular controls for node-based editors designed for data-binding and MVVM.
https://miroiu.github.io/nodify
MIT License
1.27k stars 205 forks source link

Extension of vertical-connection feature #100

Closed hendrikp closed 4 months ago

hendrikp commented 4 months ago

The adjustments discussed in !99

๐Ÿ“ Description of the Change

Split of connection orientation to source/target.

Please note the _baseOffset of 100 is quite large i noticed during my testing, however to avoid effecting existing drawing i didn't adjust it. Instead i half the offset if there is an difference of orientation, avoiding some sharp bending if the nodes get to close to each other.

So drawing of horizontal connections remains the same.

I tested all 3 connection types and 3 arrow types in both directions/orientations.

Usage pattern:

PortViewModel.cs:

private Orientation _orientation;
public Orientation Orientation
{
    get => _orientation;
    set => SetProperty(ref _orientation, value);
}

*.xaml:

        <DataTemplate x:Key="ConnectionTemplate">
            <nodify:Connection Style="{StaticResource ConnectionStyle}"
                               SourceOrientation="{Binding Output.Orientation}"
                               TargetOrientation="{Binding Input.Orientation}" />
        </DataTemplate>

๐Ÿ› Possible Drawbacks

Increased connection drawing complexity.