# 操作与交互

# 总体界面


# A.模式切换按钮

如图示A部分,工具栏上有选择按钮和连线按钮,可以切换当前模式进入选择模式或者是连线模式。这两种模式区别如下:

  • 选择模式下可以选择节点、连线,被选中的元素会高亮显示;其中选择节点的话,节点的连出和连入的连线也会以不同颜色标注(连出蓝色,连入绿色,连线标签不变色),选择连线的话,连线会以蓝色显示,标签也为蓝色并显示外框。
  • 连线模式下可以新增连线,拖拽修改连线起始和终止节点,修改连线经过的路径点 点击工具栏上的选择按钮或者连线按钮分别进入对应的模式,鼠标双击画布空白处也可以切换这两种模式,进入一种模式后对应的按钮变灰不可再点。

# B.新增节点按钮

如图示B部分,工具栏上有5个新增节点按钮,分别对应人工节点,自动节点,判断节点,并行节点,合并节点。点击按钮会在图上新增对应的节点,也支持从工具栏拖拽按钮新增节点。

# C.属性窗口

如图示C部分,工具栏上有工作流属性和元素属性两个按钮,点击后分别切换显示或隐藏工作流属性窗口和元素属性窗口(图示G和H)。
工作流属性窗口显示该流程各种属性设置,分为几个标签页,可以在此窗口修改流程属性;元素属性窗口显示节点或者连线的属性,同样也分多个标签页显示。

# D.存盘按钮

如图示D部分,工具栏上的存盘按钮,点击后保存当前编辑的工作流。保存的内容不仅包括流程图及节点连线配置,还包括图的缩放比例、是否显示网格线、辅助线、缩略图这样的工具配置信息。

# E.缩放工具条

如图示E部分,拖拽缩放工具条可以修改图的缩放比例。

# F.工具菜单按钮

如图示F部分,工具栏的右边有一个工具按钮,点击后出菜单显示各种工具,包括网格线、辅助线、缩略图、图片导出、搜索。

  • 网格线:是否在图上显示网格线辅助绘图
  • 辅助线:是否在拖拽节点时显示对齐辅助线
  • 缩略图:是否显示缩略图
  • 图片导出:导出当前工作流到一个png图片
  • 搜索:按名称搜索节点或者动作连线


# 画布交互

# 平移画布

画布可以拖拽平移,点中画布空白处拖拽即可整体平移画布。也可以鼠标滚轮平移,直接滚动滚轮可实现纵向平移,按着shift键滚动滚轮可实现横向平移。

# 缩放画布

可以拖动工具栏上的缩放条缩放画布比例,也可以按着ctrl键用鼠标滚轮缩放。

# 选中画布中的元素

点击节点或者连线可以选中该元素,如果按着shift键用鼠标拖一个框可以选中多个节点元素,选中多个节点后可以拖拽实现这几个选中节点的总体平移。



# 节点交互

# 新增节点

可以点击工具栏上对应节点类型的按钮新增到图上固定位置,也可以拖拽该按钮到图上任意位置新增节点。

# 移动节点

可以鼠标拖拽节点移动节点位置,如果选中多个节点可以拖拽这些节点的一起移动。

# 删除节点

选中节点后,按Delete键可删除该节点,该节点上的连线自动全部删除。选中多个节点后,这些节点可以一起被删除。



# 连线交互

# 新增连线

要想新增连线必须先进入连线模式,进入连线模式后点击第一个节点作为起始节点,拖拽连线到第二个节点作为终止节点,连线结束。

# 删除连线

选中一条连线后按Delete键可删除,无须进入连线模式。在删除了连线端点的节点后,该连线也将自动删除。

# 连线标签

连线标签即流程执行操作的按钮上的文字,该标签可以拖拽修改位置,修改标签位置无须进入连线模式,拖拽标签时,标签位置沿连线路径移动。标签内容可以在元素属性窗口输入。

# 连线类型

选中连线后,在元素属性窗口的最后一页可以选择连线类型,连线分直线和折线(连线由多段水平或垂直直线段组成)两种,可在此切换。鼠标右键点击连线会弹出菜单,也可以修改连线类型。

# 路径点

连线可以指定其经过的路径点,直线或者折线都可以指定路径点,通过指定路径点可以让连线按不同位置连接节点。 要想修改路径点必须先进入连线模式,然后选中该连线,再点击连线任意位置即可增加路径点(红色圆点),拖拽鼠标可以修改路径点位置。路径点可以有多个,在已经有了至少一个路径点的情况下,点击最后一个路径点到终点之间的位置是新增路径点,点击起点到路径点之间的位置时是修改该位置后最近一个路径点的位置。双击路径点可以删除该点。在元素属性窗口的连线类型页有一个清理按钮,点击该按钮可以删除该连线上所有路径点,同样鼠标右键菜单上也有清理功能。

# 修改连接点

可以修改选中连线的连接点,首先进入连线模式,选中连线后,连线两端点会出现两个菱形,拖拽该菱形图标可以将其连接到别的节点.