应用于电子设备的流程图布局方法、装置和电子设备与流程

本公开涉及一种应用于电子设备的流程图布局方法、流程图布局装置和电子设备。

背景技术：

在很多的时候，都需要进行流程设计，而基于浏览器的在线流程设计器最难的部分就是流程节点的摆布。目前大多数基于浏览器的在线流程图设计器都是由流程图设计者自己拖动摆放节点，拖到哪里是哪里，虽然可以自由摆放，但要实现一个清晰美观的流程图非常不容易。虽然已经出现了一些自动布局的相关技术，但需要设计者从菜单中找到相关功能的选项，或者点击特定按钮，操作不便。

技术实现要素：

本公开的一个方面提供了一种应用于电子设备的流程图布局方法，包括从展示有流程图的展示界面中确定第一区域，其中，所述流程图的展示界面包括功能区和展示区，所述展示区包括流程图占用的第二区域，所述第一区域为所述展示区中除第二区域以外的区域，以及响应于针对所述第一区域的触发事件，对所述展示界面中展示的流程图重新布局。

可选地，所述从展示有流程图的展示界面中确定第一区域包括从所述展示界面的展示区中确定流程图的多个顶点，连接所述多个顶点，围成所述第二区域，并将所述展示区中除第二区域以外的区域确定为第一区域。

可选地，所述连接所述多个顶点，围成所述第二区域包括连接所述多个顶点得到多边形区域，将所述多边形区域以及紧邻所述多边形区域外侧的特定宽度的区域作为所述第二区域。

可选地，所述从展示有流程图的展示界面中确定第一区域包括获得用户操作的历史数据，至少基于所述历史数据，从展示有流程图的展示界面中确定所述特定宽度。

可选地，所述方法还包括确定所述第一区域中的至少一个互不连通的子区域，从所述第一区域中删除包含像素点的数量少于第一阈值的子区域。

可选地，所述从展示有流程图的展示界面中确定第一区域包括获得用户操作的历史数据，至少基于所述历史数据，从展示有流程图的展示界面中确定所述第一阈值。

可选地，所述流程图中包括至少一个用于表示人工智能模型的节点，待处理数据能够以所述流程图表征的方式流转，所述待处理数据通过所述节点，表征所述数据经所述人工智能模型处理，并以模型定义的格式输出。

可选地，所述方法还包括以第一显示参数显示所述第一区域和第二区域，在检测到光标处于所述第一区域时，以第二显示参数显示所述第一区域，或者，在检测到光标处于所述第二区域时，以第三显示参数显示所述第二区域。

可选地，所述针对第一区域的触发事件包括基于在所述第一区域检测到的特定操作产生的触发事件，其中，所述特定操作包括双击操作、长按操作、多点触控操作中的至少一种。

可选地，所述方法还包括响应于流程图编辑事件，检测所述展示界面，以更新所述第一区域。

本公开的另一个方面提供了流程图布局装置，包括确定模块和布局模块。确定模块，用于从展示有流程图的展示界面中确定第一区域，其中，所述流程图的展示界面包括功能区和展示区，所述展示区包括流程图占用的第二区域，所述第一区域为所述展示区中除第二区域以外的区域。布局模块，用于响应于针对所述第一区域的触发事件，对所述展示界面中展示的流程图重新布局。

本公开的另一个方面提供了一种电子设备，包括，至少一个处理器以及至少一个存储器，用于存储一个或多个计算机可读指令，其中，当所述一个或多个计算机可读指令被所述至少一个处理器执行时，使得所述处理器执行如上所述的方法。

本公开的另一方面提供了一种非易失性存储介质，存储有计算机可执行指令，所述指令在被执行时用于实现如上所述的方法。

本公开的另一方面提供了一种计算机程序，所述计算机程序包括计算机可执行指令，所述指令在被执行时用于实现如上所述的方法。

附图说明

为了更完整地理解本公开及其优势，现在将参考结合附图的以下描述，其中：

图1a～图1c示意性示出了根据本公开的实施例的流程图布局方法的示例性场景；

图2示意性示出了根据本公开实施例的流程图布局方法的流程图；

图3a示意性示出了根据本公开实施例的确定第一区域的流程图；

图3b示意性示出了根据本公开另一实施例的确定第一区域的流程图；

图3c示意性示出了根据本公开实施例的确定特定宽度或第一阈值的流程图；

图3d示意性示出了根据本公开实施例的显示第一区域或第二区域的流程图；

图4示意性示出了根据本公开实施例的流程图布局装置的框图；以及

图5示意性示出了根据本公开实施例的计算机系统的框图。

具体实施方式

以下，将参照附图来描述本公开的实施例。但是应该理解，这些描述只是示例性的，而并非要限制本公开的范围。在下面的详细描述中，为便于解释，阐述了许多具体的细节以提供对本公开实施例的全面理解。然而，明显地，一个或多个实施例在没有这些具体细节的情况下也可以被实施。此外，在以下说明中，省略了对公知结构和技术的描述，以避免不必要地混淆本公开的概念。

在此使用的术语仅仅是为了描述具体实施例，而并非意在限制本公开。在此使用的术语“包括”、“包含”等表明了所述特征、步骤、操作和/或部件的存在，但是并不排除存在或添加一个或多个其他特征、步骤、操作或部件。

在此使用的所有术语(包括技术和科学术语)具有本领域技术人员通常所理解的含义，除非另外定义。应注意，这里使用的术语应解释为具有与本说明书的上下文相一致的含义，而不应以理想化或过于刻板的方式来解释。

在使用类似于“a、b和c等中至少一个”这样的表述的情况下，一般来说应该按照本领域技术人员通常理解该表述的含义来予以解释(例如，“具有a、b和c中至少一个的系统”应包括但不限于单独具有a、单独具有b、单独具有c、具有a和b、具有a和c、具有b和c、和/或具有a、b、c的系统等)。在使用类似于“a、b或c等中至少一个”这样的表述的情况下，一般来说应该按照本领域技术人员通常理解该表述的含义来予以解释(例如，“具有a、b或c中至少一个的系统”应包括但不限于单独具有a、单独具有b、单独具有c、具有a和b、具有a和c、具有b和c、和/或具有a、b、c的系统等)。

附图中示出了一些方框图和/或流程图。应理解，方框图和/或流程图中的一些方框或其组合可以由计算机程序指令来实现。这些计算机程序指令可以提供给通用计算机、专用计算机或其他可编程数据处理装置的处理器，从而这些指令在由该处理器执行时可以创建用于实现这些方框图和/或流程图中所说明的功能/操作的装置。本公开的技术可以硬件和/或软件(包括固件、微代码等)的形式来实现。另外，本公开的技术可以采取存储有指令的计算机可读存储介质上的计算机程序产品的形式，该计算机程序产品可供指令执行系统使用或者结合指令执行系统使用。

图1a～图1c示意性示出了根据本公开的实施例的流程图布局的示例性场景。

如图1a所示，一种流程图的显示界面10例如可以包括功能区11和展示区12。功能区11中可以设置有多个可交互的功能控件，例如按钮等，用户可以通过在该些功能控件上执行操作以实现相应的功能。展示区12可以用于展示流程图，流程图上可以包括多个节点以及用于连接该些节点的连线。节点用于表示流程中的关键环节，连线用于表示流程在多个节点之间的执行顺序。

根据本公开实施例，所述流程图中包括至少一个用于表示人工智能模型的节点，待处理数据能够以所述流程图表征的方式流转，所述待处理数据通过所述节点，表征所述数据经所述人工智能模型处理，并以模型定义的格式输出。

例如，在用户需要设计一套用于处理复杂场景的人工智能模型时，可以将多个用于表示基础人工智能模型的节点组合成流程图，可实现复杂场景的人工智能模型的搭建，其中，基础人工智能模型是用于基础场景的人工智能模型，例如语音识别模型、人脸识别模型等。

根据本公开实施例，用户在初次绘制流程图的各个节点和连线时，通常难以得知后续节点和连线的情况，从而在绘制完成后，一般都存在流程图布局不合理的情况，例如，某一局部节点和连线众多，而另一局部节点和连线稀少甚至没有，展示空间没有充分利用，导致流程图既不美观，又提高了阅读难度。为了得到如1b所示的清晰美观的流程图，相关技术中基于浏览器的在线流程图设计器通常由流程图设计者自己拖动摆放节点，但经常花费用户大量时间。目前，已经出现了一些自动布局的相关技术，但需要设计者从菜单中找到相关功能的选项，或者点击特定按钮，操作不便。

本公开的实施例提供了一种应用于电子设备的流程图布局方法，包括从展示有流程图的展示界面中确定第一区域，其中，所述流程图的展示界面包括功能区和展示区，所述展示区包括流程图占用的第二区域，所述第一区域为所述展示区中除第二区域以外的区域，以及响应于针对所述第一区域的触发事件，对所述展示界面中展示的流程图重新布局。

如图1c所示，该流程图展示界面中的展示区可以包括第一区域121和第二区域122。该第二区域122可以是根据流程图的当前布局而确定的，为流程图当前占用的区域，第一区域121可以是展示区中除第二区域122以外的部分，即展示区中的没有用于展示流程图的空白区域。本公开实施例的方法通过检测用户在第一区域上的操作，从而实现对流程图的重新布局，极大地降低了用户的操作成本。

图2示意性示出了根据本公开实施例的应用于电子设备的流程图布局方法的流程图。

如图2所示，该方法包括操作s210～s220。

在操作s210，从展示有流程图的展示界面中确定第一区域。其中，所述流程图的展示界面包括功能区和展示区，所述展示区包括流程图占用的第二区域，所述第一区域为所述展示区中除第二区域以外的区域。

根据本公开实施例，从展示有流程图的展示界面中确定第一区域可以有多种方式，例如可以参考如图3a所示的方法确定第一区域。

图3a示意性示出了根据本公开实施例的确定第一区域的流程图。

如图3a所示，该方法包括操作s311和s312。

在操作s311，从所述展示界面的展示区中确定流程图的多个顶点。

在操作s312，连接所述多个顶点，围成所述第二区域，并将所述展示区中除第二区域以外的区域确定为第一区域。

根据本公开实施例，可以根据展示区中流程图的节点的位置，从全部节点中确定部分节点，通过将该些节点连接，可以围成第二区域。

其中，从全部节点中确定部分节点可以有多种不同的策略。例如，以平面流程图为例，可以通过直角坐标系确定多个顶点的位置，并基于横坐标和纵坐标确定多个顶点，通过将该些顶点连接，确定第二区域。又如，可以基于多个顶点的位置确定一个原点位置，并基于该原点位置建立极坐标系(r，θ)以确定多个顶点的位置。该原点位置例如可以是多个顶点的重心位置。通过r值对多个顶点排序，确定多个顶点中最外侧的数个顶点，将该些顶点连接以确定第二区域。在本公开的另一实施例中，可以确定任意确定多个顶点以连成多边形，将其他顶点区分为该多边形内侧和外侧的顶点，忽略内侧的顶点，引入外侧的一个顶点构成新的多边形，重复上述操作直至多边形外侧没有顶点为止，得到的多边形所围成的区域即为第二区域。

根据本公开实施例，所述连接所述多个顶点，围成所述第二区域包括连接所述多个顶点得到多边形区域，将所述多边形区域以及紧邻所述多边形区域外侧的特定宽度的区域作为所述第二区域。例如，可以在连接形成多边形区域后，在该多边形区域的外侧扩展特定宽度的区域划分到第二区域，或者，在连接多个顶点形成多边形时，可以使用具有一定宽度的线条连接，将线条外侧的区域确定为第一区域。该方法可以减少将顶点附近识别为第一区域，从而产生误操作的问题。

根据本公开实施例，在连接多个顶点时也可以不通过直线段连接，而是根据流程图的情况通过曲线段连接，可以更加精确地划分第一区域和第二区域。

根据本公开实施例，从展示有流程图的展示界面中确定第一区域还可以通过例如图像识别的方式确定第一区域。在一些场景下，应用程序可能并不能直接确定流程图中的对象的位置，在这种情况下，可以通过图像识别的方式识别展示区中的背景区域作为第一区域。例如，可以基于像素点的像素值确定第一区域的范围。

图3b示意性示出了根据本公开另一实施例的确定第一区域的流程图。

如图3b所示，该方法包括操作s321和s322。

在操作s321，确定所述第一区域中的至少一个互不连通的子区域。

在操作s322，从所述第一区域中删除包含像素点的数量少于第一阈值的子区域。

根据本公开实施例，在一些情况下，有可能发生第二区域将展示区域分割成多个互不连通的子区域的情况。在这种情况下，如果划分的精度较高，则可能出现面积很小的子区域，例如流程图中的多条连接线围成的较小的空白区域。本公开实施例的方法可以剔除面积过小的子区域，避免了用户在一定区域内的操作产生不可控结果的情况，提高用户体验。

根据本公开的实施例，上文所述的特定宽度和第一阈值可以基于用户操作的历史数据确定，不同的用户可以使用不同的特定宽度或第一阈值。

图3c示意性示出了根据本公开实施例的确定特定宽度或第一阈值的流程图。

如图3c所示，该方法包括操作s331和s332。

在操作s331，获得用户操作的历史数据。

在操作s332，至少基于所述历史数据，从展示有流程图的展示界面中确定所述特定宽度或第一阈值。

例如，如果通过用户操作的历史数据确定用户的操作比较精确，则可以选择较小的特定宽度或第一阈值，而如果通过用户操作的历史数据确定用户的操作不够精确，则可以选择较大的特定宽度或第一阈值。可以基于用户操作的历史数据，通过人工智能模型，预测用户的操作习惯，从而确定该特定宽度或第一阈值。

根据本公开实施例，所述方法还包括响应于流程图编辑事件，检测所述展示界面，以更新所述第一区域。例如，当用户对流程图进行编辑时，例如增加或删除一个节点，或者修改一个连接关系，此时可以重新确定展示区中的第一区域和第二区域，以便用户方便地对展示区重新布局。

返回参考图2。在操作s220，响应于针对所述第一区域的触发事件，对所述展示界面中展示的流程图重新布局。

根据本公开实施例，所述针对第一区域的触发事件包括基于在所述第一区域检测到的特定操作产生的触发事件，其中，所述特定操作例如可以包括双击操作、长按操作、多点触控操作中的至少一种。例如，特定操作可以包括双击操作，如果检测到用户在第一区域中执行了双击操作，则可以触发对展示界面中展示的流程图重新布局的指令，以实现流程图的重新布局。

图3d示意性示出了根据本公开实施例的显示第一区域或第二区域的流程图。

如图3d所示，该方法包括操作s341和s342。

在操作s341，以第一显示参数显示所述第一区域和第二区域。

在操作s342，在检测到光标处于所述第一区域时，以第二显示参数显示所述第一区域，或者，在检测到光标处于所述第二区域时，以第三显示参数显示所述第二区域。

根据公开实施例，可以向用户提示第一区域和第二区域的划分。当用户控制光标移动到第一区域时，可以改变第一区域的显示参数，例如改变第一区域的背景色或显示第一区域的边界线，以达到提示用户的目的。或者，当用户控制光标移动到第二区域时，可以改变第二区域的显示参数，例如改变第二区域的背景色或显示第二区域的边界线，以达到提示用户的目的。

基于同一发明构思，本公开还提供了一种流程图布局装置，下面参照图4对本公开实施例的流程图布局装置进行说明。

图4示意性示出了根据本公开实施例的流程图布局装置400的框图。

如图4所示，该流程图布局装置400包括确定模块410和布局模块420。该装置400可以执行上面参考图2、图3a～图3d描述的方法。

确定模块410，例如执行上文参考图2所描述的操作s210，用于从展示有流程图的展示界面中确定第一区域。其中，所述流程图的展示界面包括功能区和展示区，所述展示区包括流程图占用的第二区域，所述第一区域为所述展示区中除第二区域以外的区域。

布局模块420，例如执行上文参考图2所描述的操作s220，用于响应于针对所述第一区域的触发事件，对所述展示界面中展示的流程图重新布局。

根据本公开实施例，确定模块410可以用于从所述展示界面的展示区中确定流程图的多个顶点，连接所述多个顶点，围成所述第二区域，并将所述展示区中除第二区域以外的区域确定为第一区域。

根据本公开实施例，所述连接所述多个顶点，围成所述第二区域包括连接所述多个顶点得到多边形区域，将所述多边形区域以及紧邻所述多边形区域外侧的特定宽度的区域作为所述第二区域。

根据本公开实施例，确定模块410还可以用于获得用户操作的历史数据，至少基于所述历史数据，从展示有流程图的展示界面中确定所述特定宽度。

根据本公开实施例，确定模块410还可以用于确定所述第一区域中的至少一个互不连通的子区域，从所述第一区域中删除包含像素点的数量少于第一阈值的子区域。

根据本公开实施例，确定模块410还可以用于获得用户操作的历史数据，至少基于所述历史数据，从展示有流程图的展示界面中确定所述第一阈值。

根据本公开实施例，所述流程图中包括至少一个用于表示人工智能模型的节点，待处理数据能够以所述流程图表征的方式流转，所述待处理数据通过所述节点，表征所述数据经所述人工智能模型处理，并以模型定义的格式输出。

根据本公开实施例，该装置400还可以包括显示模块，用于以第一显示参数显示所述第一区域和第二区域，并在检测到光标处于所述第一区域时，以第二显示参数显示所述第一区域，或者，在检测到光标处于所述第二区域时，以第三显示参数显示所述第二区域。

根据本公开实施例，所述针对第一区域的触发事件包括基于在所述第一区域检测到的特定操作产生的触发事件，其中，所述特定操作包括双击操作、长按操作、多点触控操作中的至少一种。

根据本公开实施例，该装置400还可以包括更新模块，用于响应于流程图编辑事件，检测所述展示界面，以更新所述第一区域。

根据本公开的实施例的模块、子模块、单元、子单元中的任意多个、或其中任意多个的至少部分功能可以在一个模块中实现。根据本公开实施例的模块、子模块、单元、子单元中的任意一个或多个可以被拆分成多个模块来实现。根据本公开实施例的模块、子模块、单元、子单元中的任意一个或多个可以至少被部分地实现为硬件电路，例如现场可编程门阵列(fpga)、可编程逻辑阵列(pla)、片上系统、基板上的系统、封装上的系统、专用集成电路(asic)，或可以通过对电路进行集成或封装的任何其他的合理方式的硬件或固件来实现，或以软件、硬件以及固件三种实现方式中任意一种或以其中任意几种的适当组合来实现。或者，根据本公开实施例的模块、子模块、单元、子单元中的一个或多个可以至少被部分地实现为计算机程序模块，当该计算机程序模块被运行时，可以执行相应的功能。

例如，确定模块410、布局模块420、显示模块以及更新模块可以合并在一个模块中实现，或者其中的任意一个模块可以被拆分成多个模块。或者，这些模块中的一个或多个模块的至少部分功能可以与其他模块的至少部分功能相结合，并在一个模块中实现。根据本公开的实施例，确定模块410、布局模块420、显示模块以及更新模块中的至少一个可以至少被部分地实现为硬件电路，例如现场可编程门阵列(fpga)、可编程逻辑阵列(pla)、片上系统、基板上的系统、封装上的系统、专用集成电路(asic)，或可以通过对电路进行集成或封装的任何其他的合理方式等硬件或固件来实现，或以软件、硬件以及固件三种实现方式中任意一种或以其中任意几种的适当组合来实现。或者，确定模块410、布局模块420、显示模块以及更新模块中的至少一个可以至少被部分地实现为计算机程序模块，当该计算机程序模块被运行时，可以执行相应的功能。

图5示意性示出了根据本公开实施例的适于实现上文描述的方法的计算机系统的方框图。图5示出的计算机系统仅仅是一个示例，不应对本公开实施例的功能和使用范围带来任何限制。

如图5所示，计算机系统500包括处理器510和计算机可读存储介质520。该计算机系统500可以执行根据本公开实施例的方法。

具体地，处理器510例如可以包括通用微处理器、指令集处理器和/或相关芯片组和/或专用微处理器(例如，专用集成电路(asic))，等等。处理器510还可以包括用于缓存用途的板载存储器。处理器510可以是用于执行根据本公开实施例的方法流程的不同动作的单一处理单元或者是多个处理单元。

计算机可读存储介质520，例如可以是非易失性的计算机可读存储介质，具体示例包括但不限于：磁存储装置，如磁带或硬盘(hdd)；光存储装置，如光盘(cd-rom)；存储器，如随机存取存储器(ram)或闪存；等等。

计算机可读存储介质520可以包括计算机程序521，该计算机程序521可以包括代码/计算机可执行指令，其在由处理器510执行时使得处理器510执行根据本公开实施例的方法或其任何变形。

计算机程序521可被配置为具有例如包括计算机程序模块的计算机程序代码。例如，在示例实施例中，计算机程序521中的代码可以包括一个或多个程序模块，例如包括521a、模块521b、……。应当注意，模块的划分方式和个数并不是固定的，本领域技术人员可以根据实际情况使用合适的程序模块或程序模块组合，当这些程序模块组合被处理器510执行时，使得处理器510可以执行根据本公开实施例的方法或其任何变形。

根据本发明的实施例，确定模块410、布局模块420、显示模块以及更新模块中的至少一个可以实现为参考图5描述的计算机程序模块，其在被处理器510执行时，可以实现上面描述的相应操作。

本公开还提供了一种计算机可读存储介质，该计算机可读存储介质可以是上述实施例中描述的设备/装置/系统中所包含的；也可以是单独存在，而未装配入该设备/装置/系统中。上述计算机可读存储介质承载有一个或者多个程序，当上述一个或者多个程序被执行时，实现根据本公开实施例的方法。

根据本公开的实施例，计算机可读存储介质可以是非易失性的计算机可读存储介质，例如可以包括但不限于：便携式计算机磁盘、硬盘、随机访问存储器(ram)、只读存储器(rom)、可擦式可编程只读存储器(eprom或闪存)、便携式紧凑磁盘只读存储器(cd-rom)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本公开中，计算机可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。

附图中的流程图和框图，图示了按照本公开各种实施例的系统、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上，流程图或框图中的每个方框可以代表一个模块、程序段、或代码的一部分，上述模块、程序段、或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意，在有些作为替换的实现中，方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如，两个接连地表示的方框实际上可以基本并行地执行，它们有时也可以按相反的顺序执行，这依所涉及的功能而定。也要注意的是，框图或流程图中的每个方框、以及框图或流程图中的方框的组合，可以用执行规定的功能或操作的专用的基于硬件的系统来实现，或者可以用专用硬件与计算机指令的组合来实现。

本领域技术人员可以理解，本公开的各个实施例和/或权利要求中记载的特征可以进行多种组合和/或结合，即使这样的组合或结合没有明确记载于本公开中。特别地，在不脱离本公开精神和教导的情况下，本公开的各个实施例和/或权利要求中记载的特征可以进行多种组合和/或结合。所有这些组合和/或结合均落入本公开的范围。

尽管已经参照本公开的特定示例性实施例示出并描述了本公开，但是本领域技术人员应该理解，在不背离所附权利要求及其等同物限定的本公开的精神和范围的情况下，可以对本公开进行形式和细节上的多种改变。因此，本公开的范围不应该限于上述实施例，而是应该不仅由所附权利要求来进行确定，还由所附权利要求的等同物来进行限定。