声明

学习Qt示例 diagramscene ，在此基础上做功能的扩展。

开发环境

Vs 2022 + Qt5.9.1

实现功能

1、拖入单个流程图；
2、切换为连线功能，进行流程图之间的连线；
3、可以自由拖动流程图；
4、ctrl + 滚轮 进行放大缩小；
5、“新建” 菜单按钮进行新建；
6、“保存” 菜单按钮进行流程图设计的保存，保存为json文件；
7、“加载” 菜单按钮进行文件的读取显示。

主界面

保存文件

保存文件的格式为json。

刚刚保存的流程图设计内容，每一个流程图匹配一个uuid进行标识

{"Diagram": [{"arrow": ["{5e1bfb25-9753-4bf8-82ac-864fdcb61111}","{03dda701-4f00-48e1-9c2b-9fab267e2945}"],"name": "x1","uuid": "{2ca09772-db26-4d22-90e9-a9c06279c0a9}","x": 1470,"y": 1073},{"arrow": ["{2ca09772-db26-4d22-90e9-a9c06279c0a9}"],"name": "Item 2","uuid": "{03dda701-4f00-48e1-9c2b-9fab267e2945}","x": 1412,"y": 898},{"arrow": ["{917c0116-7a1a-482e-8055-a83550dbd2cf}","{2ca09772-db26-4d22-90e9-a9c06279c0a9}"],"name": "Item 3","uuid": "{5e1bfb25-9753-4bf8-82ac-864fdcb61111}","x": 1065,"y": 1096},{"arrow": ["{5e1bfb25-9753-4bf8-82ac-864fdcb61111}","{03dda701-4f00-48e1-9c2b-9fab267e2945}"],"name": "Item 2","uuid": "{917c0116-7a1a-482e-8055-a83550dbd2cf}","x": 918,"y": 848}]
}

视频

可扩展的功能

1、目前只有矩形框，可以实现椭圆、圆形、菱形等；
2、对流程图做修改后不会提示是否保存；
3、可以自定义设置背景图等；
4、可以自定义填充颜色、箭头颜色等效果；