基于c#开发的一个轻量且功能强大的节点编辑器

今天介绍一个轻量且功能强大的节点编辑器，采用纯GDI实现，无任何依赖库，体积仅100+Kb。它提供了丰富的属性和事件，使得节点之间的数据交互和通知变得非常方便。通过大量的虚函数，开发者可以自由地重写和扩展功能。适用于需要模块化和流程化功能的各种应用场景。

技术说明

环境与依赖

• 开发环境: Visual Studio 2010 (.NET 3.5)
• NuGet 包: ST.Library.UI

核心组件

1. TreeView: 用于展示和检索节点，支持拖拽节点到 NodeEditor 中。
2. PropertyGrid: 类似于 WinForm 开发中的属性窗口，用于显示和编辑节点的属性。
3. NodeEditor: 用户组合执行流程的地方，使得功能模块的执行流程可视化。

节点与数据交互

节点创建

你可以像创建 WinForm 一样创建一个节点：

using ST.Library.UI.NodeEditor;publicclassMyNode : STNode{publicMyNode() {this.Title = "MyNode";this.TitleColor = Color.FromArgb(200, Color.Goldenrod);this.AutoSize = false;this.Size = new Size(100, 100);var ctrl = new STNodeControl();        ctrl.Text = "Button";        ctrl.Location = new Point(10, 10);this.Controls.Add(ctrl);        ctrl.MouseClick += new MouseEventHandler(ctrl_MouseClick);    }voidctrl_MouseClick(object sender, MouseEventArgs e) {        MessageBox.Show("MouseClick");    }}// 添加到编辑器中stNodeEditor.Nodes.Add(new MyNode());

数据输入输出

节点最重要的属性是数据的输入和输出，通过 InputOptions 和 OutputOptions 实现：

publicclassMyNode : STNode{protectedoverridevoidOnCreate() {base.OnCreate();this.Title = "TestNode";// 添加输入选项int nIndex = this.InputOptions.Add(new STNodeOption("IN_1", typeof(string), false));        STNodeOption op = this.InputOptions.Add("IN_2", typeof(int), true);// 添加输出选项this.OutputOptions.Add("OUT", typeof(string), false);    }protectedoverridevoidOnOwnerChanged() {base.OnOwnerChanged();if (this.Owner == null) return;// 设置数据类型的颜色this.Owner.SetTypeColor(typeof(string), Color.Yellow);this.Owner.SetTypeColor(typeof(int), Color.DodgerBlue, true);     }}

数据交互

通过绑定 DataTransfer 事件和调用 TransferData 方法，节点之间可以进行数据交互：

publicclassClockNode : STNode{private Thread m_thread;private STNodeOption m_op_out_time;protectedoverridevoidOnCreate() {base.OnCreate();this.Title = "ClockNode";        m_op_out_time = this.OutputOptions.Add("Time", typeof(DateTime), false);    }protectedoverridevoidOnOwnerChanged() {base.OnOwnerChanged();if (this.Owner == null) {if (m_thread != null) m_thread.Abort();return;        }this.Owner.SetTypeColor(typeof(DateTime), Color.DarkCyan);        m_thread = new Thread(() => {while (true) {                Thread.Sleep(1000);                m_op_out_time.TransferData(DateTime.Now);            }        }) { IsBackground = true };        m_thread.Start();    }}publicclassShowClockNode : STNode {private STNodeOption m_op_time_in;protectedoverridevoidOnCreate() {base.OnCreate();this.Title = "ShowTime";        m_op_time_in = this.InputOptions.Add("--", typeof(DateTime), true);        m_op_time_in.DataTransfer += new STNodeOptionEventHandler(op_DataTransfer);    }voidop_DataTransfer(object sender, STNodeOptionEventArgs e) {if (e.Status != ConnectionStatus.Connected || e.TargetOption.Data == null) {this.SetOptionText(m_op_time_in, "--");        } else {this.SetOptionText(m_op_time_in, ((DateTime)e.TargetOption.Data).ToString());        }    }}

使用说明

1. 环境搭建

安装 NuGet 包

PM> Install-Package ST.Library.UI -Version 2.0.0

创建节点

1. 创建自定义节点类：继承 STNode类，重写 OnCreate方法初始化节点属性和控件。
2. 添加输入输出选项：使用 InputOptions.Add和 OutputOptions.Add方法添加输入输出选项。
3. 处理数据交互：通过绑定 DataTransfer事件和调用 TransferData方法实现节点之间的数据交互。
   
   

集成到应用

1. 初始化 STNodeEditor 控件：在窗体中添加 STNodeEditor 控件。
2. 添加自定义节点：将创建的自定义节点实例添加到 STNodeEditor 的 Nodes集合中。
3. 配置 TreeView 和 PropertyGrid：将 TreeView 用于节点管理，PropertyGrid 用于显示和编辑节点属性。

PS：仅供学习，侵权立删。

END

喜欢文章的话请

分享

收藏

在看

点赞