之前使用MindFusion.Diagramming繪制流程圖確認很方便,只能試用版,如果長期使用,需要收費。
C#使用MindFusion.Diagramming框架繪制流程圖(2):流程圖示例_c# 畫流程圖控件-CSDN博客
這里找一個簡易開源框架NetronLight,GIT下載地址
GitCode - 全球開發者的開源社區,開源代碼托管平臺
NetronLight
NetronLight框架-圖控件【GraphControl】是由多個形狀節點【ShapeBase】和多個連線【Connection】組成。
?* SimpleRectangle由矩形Rect和四個連接端點【Connector】組成
?* Entity抽象類 表示 圖diagram中某一個對象,是所有圖的組成對象的基類
?* ①Connector 連接端點 或 【可以附著連接的形狀的位置點】:?
?* ? ?主要屬性:string Name、Connector AttachedTo、Point Point
?* ②ShapeBase 形狀基類
?* ? ?主要屬性:ConnectorCollection Connectors【一般來說固定Bottom, Left, Right, Top四個端點】、Rectangle rectangle、string Text、Point Location、Color ShapeColor
?* ? ?派生三個子類 ? SimpleRectangle【矩形節點】、OvalShape【橢圓節點】、TextLabel【文本標簽】
?* ③Connection 連線【節點之間的連線:只能通過 Connector Bottom, Left, Right, Top 這四個點進行連線】
?* ? ?主要屬性:Connector From、Connector To
新建窗體應用程序NetronLightDemo,添加對NetronLight項目【或NetronLight.dll】的引用
將默認的Form1重命名為FormNetronLightDemo,
窗體FormNetronLightDemo設計器程序如下:
FormNetronLightDemo.Designer.cs文件
namespace NetronLightDemo
{partial class FormNetronLightDemo{/// <summary>/// 必需的設計器變量。/// </summary>private System.ComponentModel.IContainer components = null;/// <summary>/// 清理所有正在使用的資源。/// </summary>/// <param name="disposing">如果應釋放托管資源,為 true;否則為 false。</param>protected override void Dispose(bool disposing){if (disposing && (components != null)){components.Dispose();}base.Dispose(disposing);}#region Windows 窗體設計器生成的代碼/// <summary>/// 設計器支持所需的方法 - 不要修改/// 使用代碼編輯器修改此方法的內容。/// </summary>private void InitializeComponent(){this.graphControl1 = new NetronLight.GraphControl();this.SuspendLayout();// // graphControl1// this.graphControl1.Location = new System.Drawing.Point(12, 4);this.graphControl1.Name = "graphControl1";this.graphControl1.ShowGrid = true;this.graphControl1.Size = new System.Drawing.Size(1093, 592);this.graphControl1.TabIndex = 0;this.graphControl1.Text = "graphControl1";// // FormNetronLightDemo// this.AutoScaleDimensions = new System.Drawing.SizeF(6F, 12F);this.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font;this.ClientSize = new System.Drawing.Size(1117, 608);this.Controls.Add(this.graphControl1);this.Name = "FormNetronLightDemo";this.Text = "NetronLight框架-圖控件【GraphControl】是由多個形狀節點【ShapeBase】和多個連線【Connection】組成。Shape由矩形Rec" +"t和四個連接端點【Connector】組成";this.ResumeLayout(false);}#endregionprivate NetronLight.GraphControl graphControl1;}
}
窗體FormNetronLightDemo測試程序如下:
FormNetronLightDemo.cs文件
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Forms;
using NetronLight;namespace NetronLightDemo
{public partial class FormNetronLightDemo : Form{public FormNetronLightDemo(){InitializeComponent();InitDiagram();}/// <summary>/// 初始化一個圖/// </summary>private void InitDiagram() {//純文本標簽,無端點TextLabel textLabel = new TextLabel(graphControl1);textLabel.Text = "開源圖表框架:NetronLight演示";textLabel.Width = 350;textLabel.Height = 33;textLabel.Location = new Point(100,33);graphControl1.Shapes.Add(textLabel);SimpleRectangle ent = this.graphControl1.AddShape(ShapeTypes.Rectangular, new Point(400, 100)) as SimpleRectangle;ent.Text = "Entity抽象類:所有圖的組成對象的基類";ent.Height = 33;ent.Width = 300;ent.ShapeColor = Color.SteelBlue;SimpleRectangle conn = this.graphControl1.AddShape(ShapeTypes.Rectangular, new Point(10, 220)) as SimpleRectangle;conn.Text = "Connection連線:只能通過 Connector Bottom, Left, Right, Top 這四個端點進行連線";conn.Height = 33;conn.Width = 600;conn.ShapeColor = Color.LightSteelBlue;SimpleRectangle shbase = this.graphControl1.AddShape(ShapeTypes.Rectangular, new Point(600, 285)) as SimpleRectangle;shbase.Text = "ShapeBase:形狀基類,由四個端口和含有文本的矩形組成";shbase.Height = 33;shbase.Width = 420;shbase.ShapeColor = Color.LightSteelBlue;SimpleRectangle con = this.graphControl1.AddShape(ShapeTypes.Rectangular, new Point(700, 170)) as SimpleRectangle;con.Text = "Connector端口:可以附著連接的形狀的位置點";con.Height = 33;con.Width = 350;con.ShapeColor = Color.LightSteelBlue;OvalShape oval = this.graphControl1.AddShape(ShapeTypes.Oval, new Point(450, 360)) as OvalShape;oval.Text = "Oval:橢圓節點";oval.Height = 43;oval.Width = 130;oval.ShapeColor = Color.AliceBlue;OvalShape rec = this.graphControl1.AddShape(ShapeTypes.Oval, new Point(620, 460)) as OvalShape;rec.Text = "SimpleRectangle:矩形節點";rec.Height = 43;rec.Width = 250;rec.ShapeColor = Color.AliceBlue;OvalShape tl = this.graphControl1.AddShape(ShapeTypes.Oval, new Point(850, 360)) as OvalShape;tl.Text = "TextLabel:純文本節點";tl.Height = 43;tl.Width = 200;tl.ShapeColor = Color.AliceBlue;//創建連線:形狀節點 由固定的四個端點Connector組成【Bottom:索引0, Left:索引1, Right:索引2, Top:索引3】graphControl1.AddConnection(ent.Connectors[0], conn.Connectors[3]);graphControl1.AddConnection(ent.Connectors[0], con.Connectors[3]);graphControl1.AddConnection(ent.Connectors[0], shbase.Connectors[3]);graphControl1.AddConnection(shbase.Connectors[0], oval.Connectors[3]);graphControl1.AddConnection(shbase.Connectors[0], rec.Connectors[3]);graphControl1.AddConnection(shbase.Connectors[0], tl.Connectors[3]);}}
}
/** NetronLight框架-圖控件【GraphControl】是由多個形狀節點【ShapeBase】和多個連線【Connection】組成。* SimpleRectangle由矩形Rect和四個連接端點【Connector】組成* Entity抽象類 表示 圖diagram中某一個對象,是所有圖的組成對象的基類* ①Connector 連接端點 或 【可以附著連接的形狀的位置點】: * 主要屬性:string Name、Connector AttachedTo、Point Point* ②ShapeBase 形狀基類* 主要屬性:ConnectorCollection Connectors【一般來說固定Bottom, Left, Right, Top四個端點】、Rectangle rectangle、string Text、Point Location、Color ShapeColor* 派生三個子類 SimpleRectangle【矩形節點】、OvalShape【橢圓節點】、TextLabel【文本標簽】* ③Connection 連線【節點之間的連線:只能通過 Connector Bottom, Left, Right, Top 這四個點進行連線】* 主要屬性:Connector From、Connector To
*/