C# WinForm GDI绘制工作流程图,支持拖拽设计、节点移动和连接线自动跟随
C# WinForm 工作流设计 工作流程图拖拽设计 GDI 绘制工作流程图 大概功能说明一下 1.支持拖动绘制工作节点 2.支持移动每个节点的移动 3.支持直线连接节点 4.支持节点移动连接线自动跟随 5.支持高亮显示选中的节点连线 6.支持能删除选中节点和连线 7.支持选中节点能显示节点的属性同时可以进行节点更改 8.支持能保存已绘制流程图后续可根据个人情况配置入库或者配置文件 9.支持能加载保存后的数据根据入库或者配置文件做相对应的开发 10.支持能绘制节点和线的文字 11.支持能自动计算两个节点之间的连接点不要手动调整 12.支持修改节点文字颜色背景颜色等等功能 13.支持绘制超出边界自动回显功能 14.支持节点右键删除功能 15.支持连接线高亮右键删除功能 最后说明软件基于 GDI 绘制工作流程图 软件没有使用任何第三方插件。 方便新手进行拓展其他功能开发。一、工具概述C# WinForm 工作流程图设计工具是一款基于 .NET Framework 4.0 开发的桌面应用专注于提供直观、高效的工作流程可视化设计能力。该工具通过拖拽式操作与 GDI 绘图技术支持用户快速创建包含开始节点、任务节点、结束节点的工作流程并能实现节点间的智能连线、属性配置与流程数据的导入导出广泛适用于业务流程规划、项目管理流程设计等场景。C# WinForm 工作流设计 工作流程图拖拽设计 GDI 绘制工作流程图 大概功能说明一下 1.支持拖动绘制工作节点 2.支持移动每个节点的移动 3.支持直线连接节点 4.支持节点移动连接线自动跟随 5.支持高亮显示选中的节点连线 6.支持能删除选中节点和连线 7.支持选中节点能显示节点的属性同时可以进行节点更改 8.支持能保存已绘制流程图后续可根据个人情况配置入库或者配置文件 9.支持能加载保存后的数据根据入库或者配置文件做相对应的开发 10.支持能绘制节点和线的文字 11.支持能自动计算两个节点之间的连接点不要手动调整 12.支持修改节点文字颜色背景颜色等等功能 13.支持绘制超出边界自动回显功能 14.支持节点右键删除功能 15.支持连接线高亮右键删除功能 最后说明软件基于 GDI 绘制工作流程图 软件没有使用任何第三方插件。 方便新手进行拓展其他功能开发。工具核心优势在于低代码操作门槛——用户无需编写代码仅通过图形化界面即可完成流程设计同时具备灵活的扩展性支持自定义节点样式、连线规则满足不同行业的流程可视化需求。二、核心功能模块一节点管理模块节点是工作流程的基础组成单元工具提供三类预设节点覆盖流程设计的全场景需求且支持节点的创建、删除、移动与属性配置。1. 节点类型与创建工具内置三种核心节点每种节点均有专属图标与功能定位通过左侧功能区按钮可快速创建开始节点流程的起点一个流程仅允许存在一个。创建时自动校验唯一性若已存在则弹出提示避免流程逻辑混乱。任务节点流程中的核心处理环节支持无限创建。节点名称默认以 GUID 生成确保唯一性用户可后续修改为业务相关名称如“审批申请”“财务审核”。结束节点流程的终点与开始节点类似仅允许存在一个防止流程出现多个终止点导致逻辑错误。创建节点时工具会自动将节点添加到中央画布PictureBox 控件并默认赋予基础样式如尺寸 100×36px、透明背景、黑色前景色用户可通过属性面板调整样式。2. 节点交互操作拖拽移动选中节点后按住鼠标左键可自由拖动节点至画布任意位置。拖动过程中节点关联的连线会实时刷新保持与其他节点的连接关系避免连线断裂或错位。节点删除支持两种删除方式——选中节点后通过右键菜单“删除”选项删除或在属性面板选择节点后点击删除按钮。删除节点时工具会自动清理该节点关联的所有连线防止残留无效连线影响流程完整性。属性配置选中节点后右侧属性面板会显示节点的详细属性包括布局位置、尺寸、自动大小、外观背景色、前景色、字体、文本对齐方式、文本节点名称等。修改属性后画布中的节点会实时更新样式无需手动刷新。3. 节点唯一性校验为保证流程逻辑的正确性工具对开始节点和结束节点做了唯一性校验创建时校验点击“开始节点”或“结束节点”按钮时工具会遍历画布中的所有节点若已存在同类型节点则弹出“已存在不能添加”提示阻止重复创建。删除后重新创建若删除已有的开始/结束节点可再次点击对应按钮创建新节点确保流程始终有且仅有一个起点和终点。二连线管理模块连线是连接不同节点、构成流程逻辑的关键工具支持节点间的智能连线并提供直线、折线两种连线样式满足不同流程布局的需求。1. 连线创建流程连线创建需通过“节点连线”功能按钮触发操作流程如下点击左侧功能区“节点连线”按钮进入连线模式工具内部通过zhizhen变量标记模式状态。点击第一个节点起点节点工具记录该节点为连线的起始端c1变量。点击第二个节点终点节点工具记录该节点为连线的终止端c2变量。系统自动校验连线合法性若起点节点为结束节点弹出“【结束结点】不能再进行工作转交”提示拒绝创建连线若连线已存在通过“起始节点名称-终止节点名称”的唯一标识校验则不重复创建。校验通过后生成连线并在画布上绘制同时将连线信息添加到连线列表lines集合。2. 连线样式与智能绘制工具支持两种连线样式用户可通过左侧“折线”复选框切换直线样式默认根据两个节点的位置自动计算最优直线路径确保连线从节点边缘出发而非节点中心提升视觉美观度。例如若起始节点在终止节点上方连线从起始节点底部中心指向终止节点顶部中心若起始节点在终止节点左侧连线从起始节点右侧中心指向终止节点左侧中心。折线样式当节点位置特殊如起始节点与终止节点在水平/垂直方向有重叠区域时自动生成折线避免连线穿过其他节点。折线的拐点位置会根据节点间距智能计算确保连线简洁、无交叉。两种样式的连线均默认添加箭头通过AdjustableArrowCap类实现箭头大小固定为 5×5px便于用户识别流程方向连线颜色默认为黑色选中时变为红色提升交互辨识度。3. 连线交互与管理连线选中支持两种选中方式——鼠标 hover 到连线上时连线自动变为红色并高亮显示或在下方连线列表ListView 控件中选中对应连线记录画布中的连线同步高亮。连线删除选中连线后通过右键菜单“删除”选项可删除连线删除后连线列表与画布中的连线会同步清除且不影响关联节点。连线列表展示下方 ListView 控件实时展示所有连线信息每条记录显示“起始节点文本-终止节点文本”如“开始节点-审批申请”便于用户快速查看流程逻辑关系。三流程数据导入导出模块为确保流程设计成果可复用、可迁移工具支持流程数据的 JSON 格式导入导出实现流程的保存与恢复。1. 流程导出保存点击顶部工具栏“导出”按钮工具会自动将当前画布中的节点信息与连线信息整理为 JSON 数据并保存到本地文件默认路径为程序运行目录下的config.json具体流程如下数据收集遍历画布中的所有节点收集节点的属性信息名称、位置、尺寸、颜色、字体、文本等遍历连线列表收集每条连线的起始节点名称与终止节点名称。数据格式转换将节点的颜色Color 类型转换为 HTML 颜色字符串如#FFFFFF字体Font 类型转换为可序列化的字符串通过FontConverter类实现确保数据可 JSON 序列化。JSON 序列化使用 Newtonsoft.Json 库将收集到的节点数据flowchart列表与连线数据flowchart_line列表序列化为 JSON 字符串格式清晰、可阅读。文件保存若目标文件已存在先删除旧文件再写入新数据保存完成后弹出“保存成功”提示告知用户操作结果。2. 流程导入加载点击顶部工具栏“导入”按钮工具会弹出文件选择对话框仅允许选择 JSON 文件用户选择文件后工具自动解析文件并在画布中恢复流程具体流程如下文件解析读取 JSON 文件内容通过JsonHelper.FromJson方法反序列化为DbEntity对象该对象包含节点列表与连线列表。节点恢复遍历节点列表根据每个节点的属性信息重新创建节点如根据 HTML 颜色字符串恢复背景色、根据字体字符串恢复字体样式并将节点添加到画布对应位置。连线恢复遍历连线列表根据起始节点名称与终止节点名称在画布中找到对应的节点重新创建连线并绘制确保流程逻辑与导出时完全一致。画布刷新导入完成后自动刷新画布与连线列表用户可直接继续编辑流程无需手动调整节点或连线位置。四画布与界面布局模块工具界面采用多区域分割布局确保功能分区清晰、操作便捷核心布局由以下部分组成区域控件类型功能定位顶部工具栏ToolStrip提供“导入”“导出”“清空”功能按钮快速触发核心操作左侧功能区SplitContainer包含节点创建按钮开始/任务/结束节点与“折线”复选框用于节点创建与连线样式切换中央画布PictureBox流程设计的核心区域用于展示、操作节点与连线右侧属性面板PropertyGrid显示选中节点的详细属性支持属性修改下方连线列表ListView展示所有连线信息支持连线选中与管理底部状态栏StatusStrip显示当前选中节点名称、连线标识等辅助信息画布PictureBox 控件支持自动滚动——当节点超出画布可视区域时自动显示滚动条便于用户查看完整流程同时支持画布点击取消选中——点击画布空白区域会取消当前选中的节点/连线清空属性面板与状态栏信息避免误操作。三、关键技术支撑工具的实现依赖多项 .NET WinForm 与图形绘制技术确保功能的稳定性与交互的流畅性GDI 绘图技术通过Graphics类实现节点连线的实时绘制支持直线、折线、箭头等图形元素确保连线样式美观、刷新流畅。控件事件模型充分利用 WinForm 控件的事件机制如MouseDownMouseMovePaint实现节点拖拽、连线实时刷新、鼠标 hover 高亮等交互功能。JSON 序列化技术基于 Newtonsoft.Json 库实现流程数据的序列化与反序列化确保数据导入导出的稳定性与兼容性。容器控件布局使用SplitContainerPanel等容器控件实现界面的灵活分割适配不同屏幕尺寸提升用户体验。四、使用流程示例以下以“员工请假流程”设计为例展示工具的完整使用流程创建节点点击“开始节点”按钮创建流程起点点击“任务节点”按钮创建“提交请假申请”“部门经理审批”“HR 备案”三个任务节点点击“结束节点”按钮创建流程终点。调整节点位置拖拽各节点至合理位置如“开始节点”在左上角“结束节点”在右下角任务节点按流程顺序横向排列。创建连线点击“节点连线”按钮依次连接“开始节点-提交请假申请”“提交请假申请-部门经理审批”“部门经理审批-HR 备案”“HR 备案-结束节点”形成完整流程。配置节点属性选中“部门经理审批”节点在属性面板将文本改为“部门经理审批3个工作日内”字体改为“微软雅黑10号加粗”背景色改为浅蓝色提升节点辨识度。保存流程点击“导出”按钮将流程保存为请假流程.json文件完成设计。后续复用若需修改流程点击“导入”按钮选择请假流程.json即可恢复之前设计的流程无需重新创建。五、注意事项与限制节点数量限制理论上支持无限创建任务节点但建议单个流程节点数量不超过 50 个避免画布过于拥挤、操作卡顿。连线规则限制不支持“多对一”多个节点同时指向一个节点以外的特殊连线如“一对多”需手动创建多条连线且结束节点不允许作为连线的起点。文件兼容性导入的 JSON 文件需为工具导出的标准格式手动修改 JSON 内容可能导致解析失败建议通过工具完成数据的修改与保存。运行环境依赖工具基于 .NET Framework 4.0 开发运行时需确保目标设备已安装该版本框架否则可能无法启动。六、总结C# WinForm 工作流程图设计工具通过模块化的功能设计、直观的图形化操作、稳定的数据导入导出能力为用户提供了高效的流程可视化解决方案。其核心价值在于降低流程设计门槛——无论是技术人员还是业务人员均可快速上手创建符合需求的工作流程同时具备良好的扩展性后续可基于现有框架增加节点自定义、流程预览、权限管理等功能进一步提升工具的实用性与适用范围。