# Version 3.0
现在: 2022-08-30
`3.0`版本进入排期开发,开发进度将同步更新。具体说明请查看 [V3_CN.md](./V3_CN.md)
now: 2022-08-30
The version `3.0` has been start coding,The development progress is updated synchronously. more info refer [V3_EN.md](./V3_EN.md)
# STNodeEditor
[![VS2010](https://img.shields.io/badge/Visual%20Studio-2010-blueviolet)](https://visualstudio.microsoft.com/zh-hans/vs/) [![.NET35](https://img.shields.io/badge/DotNet-3.5-blue)](https://www.microsoft.com/zh-cn/download/details.aspx?id=25150) [![NuGet](https://img.shields.io/badge/NuGet-5.9-blue)](https://www.nuget.org/packages/ST.Library.UI/) [![license](https://img.shields.io/badge/License-MIT-green)](https://github.com/DebugST/STNodeEditor/blob/main/LICENSE)
STNodeEditor 是一个轻量且功能强大的节点编辑器 纯`GDI`实现无任何依赖库仅仅`100+Kb` 使用方式非常简洁 提供了丰富的属性以及事件可以非常方便的完成节点之间数据的交互及通知 大量的虚函数可供开发者重写具有很高的自由性
Environment: VS2010(.NET 3.5)
![STNodeEditor](https://debugst.github.io/STNodeEditor/images/page_top.png)
![STNodeEditor](https://debugst.github.io/STNodeEditor/images/node_scan.png)
项目主页 (Project home): [DebugST.github.io/STNodeEditor](https://DebugST.github.io/STNodeEditor) (简体中文, English)
教程文档: [DebugST.github.io/STNodeEditor/doc_cn.html](https://DebugST.github.io/STNodeEditor/doc_cn.html)
Tutorials and API: [DebugST.github.io/STNodeEditor/doc_en.html](https://DebugST.github.io/STNodeEditor/doc_en.html)
Mail: (2212233137@qq.com)
NuGet: [https://www.nuget.org/packages/ST.Library.UI/](https://www.nuget.org/packages/ST.Library.UI/)
```
PM> Install-Package ST.Library.UI -Version 2.0.0
```
---
# 简介
那是一个冬季 在研究无线电安全的作者接触到了[GNURadio](https://www.gnuradio.org/) 那是作者第一次接触到节点编辑器
-> What? Excuse me... What"s this?.. 这是什么鬼东西?...
那是一个春季 不知道为什么 过完年整个世界都变了 大家被迫窝在家里 无聊至极的作者学起了[Blender](https://www.blender.org/)那是作者第二次接触到节点编辑器
-> Wo...原来这东西可以这么玩...真方便
于是一些想法在作者脑中逐渐诞生 让作者有了想做一个这样的东西的想法
那是一个夏季 不知道为什么 作者又玩起了[Davinci](http://www.blackmagicdesign.com/cn/products/davinciresolve/)那是作者第三次接触到节点编辑器 这一次的接触让作者对节点编辑器的好感倍增 作者瞬间觉得 只要是可以模块化流程化的功能 万物皆可节点化
---
# 像流程图一样使用你的功能
你是否有设想过流程图不再是流程图 而是直接可以执行的?
在一些开发过程中我们可能会为整个程序设计一个流程图 上面包含了我们存在的功能模块以及执行流程 然后由开发者逐一实现
但是这样会带来一些问题 程序的执行流程可能会被硬编码到程序中去 如果突然有一天可能需要改变执行顺序或者添加删除一个执行模块 可能需要开发者对代码重新编辑然后编译 而且各个功能模块之间的调用也需要开发者进行编码调度 增加开发成本 等一系列的问题
而 `STNodeEditor` 就是为此诞生
---
`STNodeEditor` 包含3部分 `TreeView` `PropertyGrid` `NodeEditor` 这三部分组成了一套完整的可使用框架
* TreeView
* 可以把执行功能编码到一个节点中 而 `TreeView` 则负责展示以及检索节点 在 `TreeView` 中的节点可直接拖拽添加到 `NodeEditor` 中
* PropertyGrid
* 类似与 `WinForm` 开发使用的属性窗口 作为一个节点 它也是可以有属性的 而作者在编辑器进行设计的过程中也把一个节点视作一个 `Form` 让开发者几乎没有什么学习成本直接上手一个节点的开发
*NodeEditor
*`NodeEditor` 是用户组合自己执行流程的地方 使得功能模块执行流程可视化
---
# 如何使用它?
STNodeEditor的使用非常简单 你几乎可以没有任何学习成本的去使用的 当然最重要的一点就是 你需要知道如何去创建一个节点
你可以像创建一个Form一样去创建一个Node
``` cs
using ST.Library.UI.NodeEditor;
public class MyNode : STNode
{
public MyNode() { //等同于 [override void Oncreate(){}]
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);
}
void ctrl_MouseClick(object sender, MouseEventArgs e) {
MessageBox.Show("MouseClick");
}
}
//添加到编辑器中
stNodeEditor.Nodes.Add(new MyNode());
```
<img alt="MyNode.png" src="https://img-blog.csdnimg.cn/img_convert/7c7dd3f7b17c18781c54dc210555bf56.png" width="273">
可以看到它的使用方式和 `Form` 确实很像 其实目前还暂时没有提供所见即所得的UI设计器 而且一个 `STNode` 它同样有它的控件集合且数据类型为 `STNodeControl`
`STNodeControl` 作为 `STNode` 控件的基类 它拥有着和 `System.Windows.Forms.Control` 许多同名的属性和事件 一切的初衷都只为与 `WinForm` 靠近
**注意:在目前的版本中(2.0) STNodeEditor仅仅提供了STNodeControl基类 并未提供任何一个可用控件 当然在附随的Demo工程中包含了部分示例演示如何自定义一个控件 由于这属于自定义控件的范畴 所以演示并未太多 若需了解关于自定义控件如何开发可参考作者:[自定义控件开发](http://st233.com/blog.php?group=1) 系列文章 当然在后续的版本中 作者将提供部分常用控件 虽说作者想把使用方式往WinForm上靠 单仅仅是把它当作WinForm使用并不是作者的初衷**
上面的演示仅仅是为了让大家感到亲切感 毕竟 `WinForm` 可能是大家熟悉的一个东西 但是如果仅仅是把它当作 `WinForm` 使用毫无意义 对于一个节点来说 最重要的属性当然是数据的输入和输出
``` cs
public class MyNode : STNode
{
protected override void OnCreate() {//等同 [public MyNode(){}]
base.OnCreate();
this.Title = "TestNode";
//可以得到添加的索引位置
int nIndex = this.InputOptions.Add(new STNodeOption("IN_1", typeof(string), false));
//可以得到添加的 STNodeOption
STNodeOption op = this.InputOptions.Add("IN_2", typeof(int), true);
this.OutputOptions.Add("OUT", typeof(string), false);
}
//当所有者发生改变(即:在NodeEditor中被添加或移除)
//应当像容器提交自己拥有数据类型的连接点 所期望显示的颜色
//颜色主要用于区分不同的数据类型
protected override void OnOwnerChanged() {
base.OnOwnerChanged();
if (this.Owner == null) return;
this.Owner.SetTypeColor(typeof(string), Color.Yellow);
//当前容器中已有的颜色会被替换
this.Owner.SetTypeColor(typeof(int), Color.DodgerBlue, true);
//下面的代码将忽略容器中已有的颜色
//this.SetOptionDotColor(op, Color.Red); //无需在OnOwnerChanged()中设置
}
}
```
<img alt="MyNode.png" src="https://img-blog.csdnimg.cn/img_convert/a7bb83f3bc1c39143d71a42f26668e4f.png" width="208">
通过上面的案例你可以看到 `STNode` 有两个重要的属性 `InputOptions` 和 `OutputOptions` 其数据类型为 `STNodeOption` 而 `STNodeOption` 有两种连接模式 `single-connection` 和 `multi-connection`
* single-connection
* 单连接模式 在单连接模式下一个连接点同时 只能被一个 同数据类型点的
没有合适的资源?快使用搜索试试~ 我知道了~
资源推荐
资源详情
资源评论
收起资源包目录
C# halcon流程 流程图自己可改成视觉流程 (137个子文件)
DesignTimeResolveAssemblyReferencesInput.cache 7KB
DesignTimeResolveAssemblyReferencesInput.cache 6KB
WinNodeEditorDemo.csproj.AssemblyReference.cache 5KB
ST.Library.UI.csproj.AssemblyReference.cache 3KB
WinNodeEditorDemo.csproj.GenerateResource.cache 847B
ST.Library.UI.csproj.CoreCompileInputs.cache 42B
WinNodeEditorDemo.csproj.CoreCompileInputs.cache 42B
WinNodeEditorDemo.csproj.CopyComplete 0B
STNodeEditor.cs 95KB
STNode.cs 46KB
STNodeTreeView.cs 41KB
STNodePropertyGrid.cs 36KB
STNodeOption.cs 17KB
STNodePropertyAttribute.cs 15KB
STNodeEditorPannel.cs 13KB
STNodeControl.cs 10KB
Form1.Designer.cs 10KB
STNodeHub.cs 9KB
STNodeCollection.cs 8KB
STNodeOptionCollection.cs 8KB
STNodeControlCollection.cs 7KB
FrmNodePreviewPanel.cs 6KB
STNodeEditorDataType.cs 5KB
BlenderMixColorNode.cs 5KB
FrmSTNodePropertySelect.cs 5KB
FrmSTNodePropertyInput.cs 5KB
ImageChannelNode.cs 5KB
AttrTestNode.cs 5KB
STNodeAttribute.cs 4KB
Form1.cs 4KB
ToolStripRendererEx.cs 3KB
NumberAddNode.cs 3KB
ImageInputNode.cs 3KB
CalcNode.cs 3KB
Resources.Designer.cs 3KB
FrmEnumSelect.cs 2KB
STNodeProgress.cs 2KB
NumberInputNode.cs 2KB
STNodeSelectBox.cs 2KB
AssemblyInfo.cs 1KB
STNodeCheckBox.cs 1KB
AssemblyInfo.cs 1KB
ImageBaseNode.cs 1KB
Settings.Designer.cs 1KB
STNodeHub.cs 949B
STNodeColorButton.cs 933B
NumberNode.cs 723B
Program.cs 480B
EmptyOptionTestNode.cs 476B
WinNodeEditorDemo.csproj 5KB
ST.Library.UI.csproj 4KB
index.css 7KB
stdoc.css 6KB
ST.Library.UI.dll 141KB
ST.Library.UI.dll 141KB
ST.Library.UI.dll 141KB
WinNodeEditorDemo.exe 36KB
WinNodeEditorDemo.exe 36KB
stnodehub.gif 1.9MB
stnodeeditor.gif 1.38MB
stnodetreeview.gif 1.03MB
stnodepropertygrid.gif 765KB
node.gif 742KB
stnodeeditorpannel.gif 423KB
tu_clockshowtime.gif 133KB
tu_clocknode_data.gif 98KB
tu_mynode_btn.gif 73KB
.gitignore 25B
api.html 173KB
tutorials_en.html 144KB
tutorials_cn.html 142KB
index.html 17KB
index_en.html 16KB
doc_en.html 3KB
doc_cn.html 3KB
top_bg.jpeg 174KB
jquery-1.10.2.min.js 92KB
stdoc.js 2KB
LICENSE 1KB
read.lock 0B
README.md 19KB
V3_EN.md 3KB
V3_CN.md 3KB
ST.Library.UI.pdb 346KB
ST.Library.UI.pdb 346KB
ST.Library.UI.pdb 346KB
WinNodeEditorDemo.pdb 90KB
WinNodeEditorDemo.pdb 90KB
node_show_frm.png 339KB
page_top.png 322KB
gdip.png 164KB
tu_imagenode.png 132KB
node_show_back.png 131KB
node_scan.png 106KB
node_show_mix.png 88KB
sticker.png 74KB
tu_stnodepropertygrid.png 41KB
node_ui.png 32KB
tu_colornode_3.png 30KB
tu_property_3.png 29KB
共 137 条
- 1
- 2
资源评论
视觉人机器视觉
- 粉丝: 7199
- 资源: 231
下载权益
C知道特权
VIP文章
课程特权
开通VIP
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
最新资源
资源上传下载、课程学习等过程中有任何疑问或建议,欢迎提出宝贵意见哦~我们会及时处理!
点击此处反馈
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功