一种高效快速生成控件的处理方法及装置与流程

1.本发明涉及界面设计编辑器编辑控件技术领域，具体涉及一种高效快速生成控件的处理方法及装置。


背景技术：

2.随着互联网的兴起发展，目前市面上的各式各类的界面设计编辑器也随之兴起发展，界面设计编辑器使得不擅长甚至不懂编程的人员也能很好的设计出一个界面或流程图等各种需求。通常会在界面设计编辑器生成带有一个或多个控件的界面，从而可以通过控件控制相应的一个实体装置，例如，通过一个专门用于启闭照明灯的控件，另一个用于启闭空调的控件，从而在设计出来的界面上来操控相应的装置，实现智能化控制。但目前的界面设计编辑器如果需要生成多个相同的控件，往往只能复制现有的控件，并且需要将复制出来的控件重新进行排版，这会造成用户需要重复的复制、粘贴和排版的操作，造成工作量大、效率低以及操作繁琐。特别是这样的操作会给用户在使用过程中带来不便，例如，为用户生产了一个带有界面的控制终端(如遥控器)，在该界面上有若干个控件，各个控件可以控制家里的相应装置/设备，例如控制照明灯、冰箱、空调等等，但是用户如果有新增设备或者更换设备等情况，导致用户需要新增控件或者更换控件形状甚至需要重新布局控件在界面中的排版，可能会需要使用与现有控件相同的控件，如果按传统方法进行复制、粘贴和排版操作，给用户的体验度极差。


技术实现要素：

3.针对现有技术的不足，本发明的目的提供一种高效快速生成控件的处理方法及装置，其能够解决背景技术描述到的现有技术存在的问题。
4.实现本发明的目的的技术方案为：一种高效快速生成控件的处理方法，应用于界面设计编辑器，界面设计编辑器内置有控件资源库，包括如下步骤：
5.步骤1：获取用户在界面设计编辑器的画布中所框选出来的控件，并生成一个与框选区域相同的第一矩形虚拟框；
6.步骤2：获得第一矩形虚拟框内的控件个数和类型，以及第一矩形虚拟框在画布中的位置和大小，并将第一矩形虚拟框内的控件复制到容器a中；
7.步骤3：获得用户拖动操作从初始位置至当前位置生成第二矩形虚拟框，并保存第二矩形虚拟框在画布中的位置和大小；
8.步骤4：根据第二矩形虚拟框的大小，计算确定出在第二矩形虚拟框内能够容纳所述容器a的数量，以及每个容器a在第二矩形虚拟框的位置；
9.步骤5：从控件资源库中调出与容器a内控件相同的控件，并按容器a内的控件分布加载到第二矩形虚拟框内，从而快速完成批量控件的复用。
10.进一步地，所述步骤1中，采用鼠标或者在触摸屏上触摸拖拉出一个框选区域，框选区域覆盖的控件为框选出来的控件。
11.进一步地，第一矩形虚拟框透明。
12.进一步地，第一矩形虚拟框在画布中的位置通过第一矩形虚拟框的四个顶点的坐标确定。
13.进一步地，采用键盘的某个按键 鼠标左键按下移动操作所产生的信号为第一移动信号，以鼠标左键按下时所处的位置作为初始位置，鼠标移动至当前时刻的位置为当前位置，从初始位置拖动到当前位置所覆盖的区域生成一个矩形虚拟框，该矩形虚拟框作为第二矩形虚拟框。
14.进一步地，初始位置和当前位置之间若构成一条斜线，则初始位置和当前位置为矩形虚拟框的两个相对顶角，若初始位置和当前位置之间构成的是一条竖直或水平直线，则初始位置和当前位置为矩形虚拟框长的两个顶点或宽的两个顶点，另外的宽度或长度为预设值，从而确定了第二矩形虚拟框大小。
15.进一步地，步骤4中，所述计算确定出在第二矩形虚拟框内能够容纳所述容器a的数量，其具体实现包括：
16.假设第二矩形虚拟框的大小为m*n，容器a的大小为p*q，则可以容纳t个容器a，t满足p*t≤m且q*t≤n两个关系式中的最大正整数。
17.进一步地，在步骤5中，按容器a内的控件分布加载到第二矩形虚拟框内的各个网格单元中，
18.第二矩形虚拟框包括若干个网格单元，每个网格单元大小≥容器a的大小，每个网格单元容纳一个容器a。
19.进一步地，所述步骤2中，在将控件放入至容器a后，若接收到第一修改信号，则接收用户所在容器a选中的某一行或某一列或某个控件，并提供选中控件的修改形状选项，并将用户修改形状选项的结果更新到容器a内相应的控件，最后在步骤5中，将已经改变形状的控件加载到第二矩形虚拟框的相应位置上。
20.一种处理装置，其包括：
21.存储器，用于存储程序指令；
22.处理器，用于运行所述程序指令，以执行所述高效快速生成控件的处理方法的步骤。
23.本发明的有益效果为：本发明能够能够高效快速地完成控件的复用和布局，减少了操作的繁琐度，提高了效率和用户的体验度，并且在拖动第二矩形虚拟框的过程中，自由修改控件形状。
附图说明
24.图1为本发明较佳实施例的流程示意图；
25.图2为处理装置的结构示意图。
具体实施方式
26.为了使本技术的目的、技术方案和优点更加清楚，下面结合附图对本技术具体实施例作进一步的详细描述。可以理解的是，此处所描述的具体实施例仅仅用于解释本技术，而非对本技术的限定。另外还需要说明的是，为了便于描述，附图中仅示出了与本技术相关
的部分而非全部内容。在更加详细地讨论示例性实施例之前应当提到的是，一些示例性实施例被描述成作为流程图描绘的处理或方法。虽然流程图将各项操作(或步骤)描述成顺序的处理，但是其中的许多操作可以被并行地、并发地或者同时实施。此外，各项操作的顺序可以被重新安排。当其操作完成时所述处理可以被终止，但是还可以具有未包括在附图中的附加步骤。所述处理可以对应于方法、函数、规程、子例程、子程序等等。
27.如图1所示，一种高效快速生成控件的处理方法，应用于界面设计编辑器，界面设计编辑器内置有控件资源库，包括如下步骤：
28.步骤1：获取用户在界面设计编辑器的画布中所框选出来的控件，并生成一个与框选区域相同的第一矩形虚拟框。
29.在本步骤中，用户在画布中框选出希望复用的当前控件，可以采用鼠标或者触摸屏上触摸拖拉出一个框选区域，该框选区域覆盖了希望复用的当前控件。框选区域内包括一个或多个控件，这些控件类型可能相同也可能不相同。并生成一个与框选区域相同的第一矩形虚拟框，第一矩形虚拟框是指用户无法在屏幕上肉眼可见，也即第一矩形虚拟框是透明的。
30.步骤2：获得第一矩形虚拟框内的控件个数和类型，以及第一矩形虚拟框在画布中的位置和大小，并将第一矩形虚拟框内的控件复制到容器a中。其中，第一矩形虚拟框在画布中的位置可以通过第一矩形虚拟框的四个顶点的坐标来确定。
31.步骤3：接收用户拖动操作生成的第一移动信号，并获得第一移动信号在画布中的初始位置和移动的当前位置，从初始位置至当前位置生成第二矩形虚拟框，并保存第二矩形虚拟框在画布中的位置和大小。
32.在本步骤中，可以采用键盘的某个按键 鼠标左键按下移动操作所产生的信号为第一移动信号，当然也可以是其他自定义的移动信号，通过自定义的移动信号，使得一旦接收到该移动信号，则意味着需要框选出第二矩形虚拟框。以鼠标左键按下时所处的位置作为初始位置，鼠标移动至当前时刻的位置为当前位置，从初始位置拖动到当前位置所覆盖的区域生成一个矩形虚拟框。其中，初始位置和当前位置之间若构成一条斜线，则初始位置和当前位置为矩形虚拟框的两个相对顶角，可以唯一确定矩形虚拟框大小；如果初始位置和当前位置之间构成的是一条竖直或水平直线，则初始位置和当前位置为矩形虚拟框长的两个顶点或宽的两个顶点，另外的宽度或长度根据预设确定，从而确定了第二矩形虚拟框大小。
33.步骤4：根据第二矩形虚拟框的大小，计算确定出在第二矩形虚拟框内能够容纳所述容器a的数量，以及每个容器a在第二矩形虚拟框的位置。
34.在本步骤中，容器a内存储了框选的控件个数和类型，框选的各个控件仍然按原先的分布在容器a内分布，而各个控件本身具有一定的大小，因此，多个控件在容器a内仍然需要占据一定大小的位置范围，使得容器a具有尺寸大小。而第二矩形虚拟框是用户在未有控件分布区域拖动出的范围，也同样具有一定的大小。因此，第二矩形虚拟框能够容纳整数倍或非整数倍的容器a，但只能将整数倍的容器a设置在第二矩形虚拟框内。也将相当于是在第二矩形虚拟框内形成若干个网格单元，每个网格单元大小≥容器a的大小，每个网格单元容纳一个容器a。由于每一个网格在第二矩形虚拟框内的位置是确定的，因此，容纳在第二矩形虚拟框内的容器a的分布也就确定了。
35.例如，第二矩形虚拟框的大小为30*20，若容器a的大小为5*4，则第二矩形虚拟框可以容纳5个；若容器a的大小为5*3，则可以容纳6个；若容器a的大小为4*3，则可以容纳6个。也即是，假设第二矩形虚拟框的大小为m*n，容器a的大小为p*q，则可以容纳t个容器a，t满足p*t≤m且q*t≤n两个关系式中的最大正整数。
36.步骤5：从控件资源库中调出与容器a内控件相同的控件，并按容器a内的控件分布加载到第二矩形虚拟框内的各个网格单元中，从而快速完成批量控件的复用。
37.在一个可选的另外一个实施方式中，所述步骤2中，在将控件放入至容器a后，若接收到第一修改信号，则接收用户所选择在容器a中某一行或某一列或某个控件，并提供选择控件需要改变的控件形状的选项，并将用户选择的控件形状后更新容器a内相应的控件形状，最后在步骤5中，将已经改变形状的控件也加载到第二矩形虚拟框的相应位置上，从而可以在复用同类型控件的同时可以改变控件形状，提高用户体验度。
38.本发明能够能够高效快速地完成控件的复用和布局，减少了操作的繁琐度，提高了效率和用户的体验度，并且在拖动第二矩形虚拟框的过程中，自由修改控件形状。
39.如图2所示，本发明还提供一种处理装置100，其包括：
40.存储器101，用于存储程序指令；
41.处理器102，用于运行所述程序指令，以执行所述所述高效快速生成控件的处理方法的步骤。
42.本发明是参照根据本发明实施例的方法、设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器，使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。
43.这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中，使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品，该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。
44.这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上，使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理，从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。
45.尽管已描述了本发明的优选实施例，但本领域内的技术人员一旦得知了基本创造性概念，则可对这些实施例作出另外的变更和修改。所以，所附权利要求意欲解释为包括优选实施例以及落入本发明范围的所有变更和修改。
46.显然，本领域的技术人员可以对本发明进行各种改动和变型而不脱离本发明的精神和范围。这样，倘若本发明的这些修改和变型属于本发明权利要求及其等同技术的范围之内，则本发明也意图包括这些改动和变型在内。