第一节：Nodify 的简介和安装

引言

Nodify 是专为 MVVM 设计的基于节点的编辑器的高性能控件集合。其中包含一系列节点、连接和连接器组件，旨在简化构建基于节点的工具的过程。它提供了一个节点图编辑器组件，可以嵌入到任何 WPF 应用程序中。该图形编辑器是一个无限区域，您可以在其中放置和移动节点，选择和拖动节点组，连接和断开节点或连接器，放大和缩小，以及在将节点或导线拖动到边缘附近时自动移动屏幕等。

形状画布

 游乐场应用程序

状态机 

“实时”计算器

1、安装

通过Nuget包管理器搜索或通过以下代码安装：

Install-Package Nodify

 该项目也是开源的，有兴趣可以访问其仓库：miroiu/nodify：高性能和模块化的控件，适用于基于节点的编辑器，专为数据绑定和 MVVM 而设计。 (github.com)https://github.com/miroiu/nodify

 2、配置

在Nodify有三种主题可选，选择一种添加到对应的资源中。

<ResourceDictionary Source="pack://application:,,,/Nodify;component/Themes/Dark.xaml" />
<ResourceDictionary Source="pack://application:,,,/Nodify;component/Themes/Light.xaml" />
<ResourceDictionary Source="pack://application:,,,/Nodify;component/Themes/Nodify.xaml" />

 我呢就直接添加到App.xaml中，选择Dark主题

<Application
    x:Class="NodifyTest.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:NodifyTest"
    StartupUri="MainWindow.xaml">
    <Application.Resources>
        <ResourceDictionary Source="pack://application:,,,/Nodify;component/Themes/Dark.xaml" />
    </Application.Resources>
</Application>

3、三层结构

理解Nodify的三层设计结构，对我们后续开发很有帮助：

Editor：根组件是一个编辑器（editor），它包含节点（nodes）和连接（connections）以及一些额外的UI元素，如选择框（selection rectangle）和一个预备连接（pending connection），以使编辑器具有交互性。

Node：节点是连接器(connectors)的容器，有时候节点本身也可以作为连接器(比如 状态节点).

Connection：连接器可以创建预备连接（PendingConnection），预备连接在完成后可以成为实际的连接。