一种web在线表单实时调整条目顺序的方法与流程

1.本发明涉及计算机应用技术领域，尤其涉及一种web在线表单实时调整条目顺序的方法。

背景技术：

2.在互联网技术愈发发达的今天，大量的表单需要被处理。在软件的设计过程中，表单设计交互组件是必不可少的一环，如何提高表单内容的编辑效率是软件行业的一大难题。
3.在传统表单需要将上下条目进行重新排序时，往往需要用户先进入设置模式，再勾选选择需要调整的条目，再通过“上下”按钮调上调下，使得办公效率低下。

技术实现要素：

4.本发明的目的是为了解决现有技术中存在的缺点，而提出的一种web在线表单实时调整条目顺序的方法。
5.为实现上述目的，本发明采用了如下技术方案：一种web在线表单实时调整条目顺序的方法，包括屏幕上显示的图形用户界面，所述图形用户界面包括显示区域、表单编辑区域；包括以下步骤：s1：检测初始表单，对初始表单的条目依次排序并获取表单的条目的坐标；s2：鼠标触发初始表单的编辑状态；s3：响应用户的拖动操作，移动目标条目；响应用户对目标条目的拖动操作，将目标条目做为浮窗的形式显示并随鼠标拖动；s4：鼠标停止的位置处预留编辑区域；s5：目标条目粘贴至编辑区域生成调整表单；s6：调整表单重新排序；s7：表单确认无误后，保存表单，生成最终表单，完成改变表单的条目顺序操作。
6.进一步的，步骤s1具体为：对屏幕上显示的初始表单进行检测，获取初始表单中的表单条目的数量，对表单条目依次排序，使表单条目与序号一一对应；表单条目的序号记为i；根据表单条目的序号循环获取对应的表单条目的坐标；所述表单条目的坐标包括条目的左上坐标、条目的左下坐标、条目的右上坐标以及条目的右下坐标；坐标是以表单编辑区域的左上角作为坐标原点（0,0），往右为x轴正方向，往下为y轴正方向建立的坐标系中的点坐标，坐标长度单位为像素。
7.进一步的，步骤s2具体为：移动鼠标，使鼠标的光标位于目标条目的位置，鼠标按下左键保持2秒不松开，触
发编辑控件，所述编辑控件获取光标的坐标并获取光标坐标落入的目标条目的坐标，用明显亮依次连接目标条目的左上坐标、目标条目的左下坐标、目标条目的右下坐标、目标条目的右上坐标以及目标条目的左上坐标构成条目边框，并在目标条目的头部显示编辑指示“请拖动至指定位置”；所述目标条目为所需要改变位置的表单条目。
8.进一步的，步骤s3：具体包括：将编辑控件获取的光标的坐标作为拖动点q(x1,y1)，用户按下鼠标左键进行拖动，编辑控件实时获取光标的坐标q＇(x2,y2),计算偏移值，计算目标条目的实时坐标，使用目标条目的实时坐标替换目标条目的坐标。
9.进一步的，计算偏移值包括：计算x方向的偏移值：λx= x2
‑ꢀ
x1；计算y方向的偏移值：λy= y2
‑ꢀ
y1；将目标条目的坐标同步偏移，偏移值与光标的坐标的偏移值相同，实现目标条目随鼠标移动；获取目标条目的左上坐标a(x3,y3)、目标条目的左下坐标b(x4,y4)、目标条目的右下坐标c(x5,y5)、目标条目的右上坐标d(x6,y6)；随光标移动，将目标条目的坐标替换为：目标条目的左上坐标a (x3+λx,y3+λy)、目标条目的左下坐标b(x4+λx,y4+λy)、目标条目的右下坐标c(x5+λx,y5+λy)、目标条目的右上坐标d(x6+λx,y6+λy)。
10.进一步的，步骤s4具体包括：s41：获取鼠标停止位置的表单条目的序号；首先获取鼠标停止位置的坐标并获取鼠标停止位置的坐标落入的表单条目的坐标及表单条目的序号；将鼠标停止位置的表单条目的序号记为m；s42：调整表单条目的坐标预留编辑区域；获取目标条目的序号并将其记为n；当m》n时，循环比较表单条目的序号i，将n《i≤m的序号i对应的表单条目的坐标依次替换为序号i-1表单条目的坐标，其他序号i的表单条目的坐标不变，将原序号m的表单条目处的位置空出作为编辑区域；当m《n时循环比较表单条目的序号i，将m≤i《n的序号i对应的表单条目的坐标依次替换为序号i+1表单条目的坐标，其他序号i的表单条目的坐标不变，将原序号m的表单条目处的位置空出编辑区域。
11.进一步的，确认需要将条目顺序调整成当前状态后，松开鼠标左键，松开后，目标条目的坐标替换为原序号m的表单条目的坐标，生成所述调整表单；对屏幕上显示的调整表单进行检测，赋予调整表单新的序号替换初始表单的序号。
12.进一步的，所述明显亮包括黄、橙。
13.进一步的，i=1 、2、 3
…
。
14.与现有技术相比，本发明的有益效果为：（1）本发明通过显示所述操作的移动轨迹，能够让用户更加直观地看到所希望被拖动的表单条目被移动的位置以及最终效果，使
得用户能够准确达到调整表单顺序的操作目标。（2）本发明通过交互方式可以更快速有效的完成调整顺序的操作，所见即所得，简化操作步骤只需一按住、二拖动、三松手即可实现顺序调整。
附图说明
15.图1为本发明一种web在线表单实时调整条目顺序的方法的步骤流程图；图2为本发明一种web在线表单实时调整条目顺序的方法的操作过程图。
具体实施方式
16.为使对本发明的目的、构造、特征、及其功能有进一步的了解，兹配合实施例详细说明如下。
17.一种web在线表单实时调整条目顺序的方法，包括屏幕上显示的图形用户界面，所述图形用户界面包括显示区域、表单编辑区域等，其中显示区域用于显示表单，表单编辑区域用于对表单内容进行编辑；包括以下步骤：s1：检测初始表单，对初始表单的条目依次排序并获取表单的条目的坐标；对屏幕上显示的初始表单进行检测，获取初始表单中的表单条目的数量，对表单条目依次排序，使表单条目与序号一一对应；表单条目的序号记为i，i=1 、2、 3
…
。
18.根据表单条目的序号循环获取对应的表单条目的坐标；表单条目的坐标包括条目的左上坐标、条目的左下坐标、条目的右上坐标以及条目的右下坐标；坐标是以表单编辑区域的左上角作为坐标原点（0,0），往右为x轴正方向，往下为y轴正方向建立的坐标系中的点坐标，坐标长度单位为像素。以编辑区域的右上角做为坐标原点，保证编辑区域内的表单条目相对于编辑区域内顺序调整时不会发生表单条目偏移，造成条目混乱，影响美观。
19.s2：鼠标触发初始表单的编辑状态；移动鼠标，使鼠标的光标位于目标条目的位置，鼠标按下左键保持2秒不松开，触发编辑控件，所述编辑控件获取光标的坐标并获取光标坐标落入的目标条目的坐标，用明显亮如黄、橙等依次连接目标条目的左上坐标、目标条目的左下坐标、目标条目的右下坐标、目标条目的右上坐标以及目标条目的左上坐标构成条目边框，并在目标条目的头部显示编辑指示“请拖动至指定位置”。
20.所述目标条目为所需要改变位置的表单条目；s3：响应用户的拖动操作，移动目标条目；响应用户对目标条目的拖动操作，将目标条目做为浮窗的形式显示并随鼠标拖动。
21.具体包括：将编辑控件获取的光标的坐标作为拖动点q(x1,y1)，用户按下鼠标左键进行拖动，编辑控件实时获取光标的坐标q＇(x2,y2),计算偏移值，计算目标条目的实时坐标，使用目标条目的实时坐标替换目标条目的坐标；计算x方向的偏移值：λx= x2
‑ꢀ
x1；
计算y方向的偏移值：λy= y2
‑ꢀ
y1；获取目标条目的左上坐标a(x3,y3)、目标条目的左下坐标b(x4,y4)、目标条目的右下坐标c(x5,y5)、目标条目的右上坐标d(x6,y6)；将目标条目的坐标同步偏移，偏移值与光标的坐标的偏移值相同，实现目标条目随鼠标移动；随光标移动，将目标条目的坐标替换为：目标条目的左上坐标a (x3+λx,y3+λy)、目标条目的左下坐标b(x4+λx,y4+λy)、目标条目的右下坐标c(x5+λx,y5+λy)、目标条目的右上坐标d(x6+λx,y6+λy)；通过显示所述操作的移动轨迹，能够让用户更加直观地看到所希望被拖动的表单条目被移动的位置以及最终效果，使得用户能够准确达到调整表单顺序的操作目标。
22.s4：鼠标停止的位置处预留编辑区域；当鼠标停止在表单列表中的指定位置时，当前条目自动向上或向下移动，为按下跟随鼠标的想要调整位置的表单条目预留位置；具体包括：s41：获取鼠标停止位置的表单条目的序号；首先获取鼠标停止位置的坐标并获取鼠标停止位置的坐标落入的表单条目的坐标及表单条目的序号；将鼠标停止位置的表单条目的序号记为m。
23.s42：调整表单条目的坐标预留编辑区域；获取目标条目的序号并将其记为n；当m》n时，循环比较表单条目的序号i，将n《i≤m的序号i对应的表单条目的坐标依次替换为序号i-1表单条目的坐标，其他序号i的表单条目的坐标不变，从而将原序号m的表单条目处的位置空出作为编辑区域；当m《n时循环比较表单条目的序号i，将m≤i《n的序号i对应的表单条目的坐标依次替换为序号i+1表单条目的坐标，其他序号i的表单条目的坐标不变，从而将原序号m的表单条目处的位置空出编辑区域；s5：目标条目粘贴至编辑区域生成调整表单；确认需要将条目顺序调整成当前状态后，松开鼠标左键，松开后，目标条目的坐标替换为原序号m的表单条目的坐标，实现被拖动至此的目标条目吸附在编辑区域的当前位置，上方和下方移动让位的条目与拖动的表单贴合，生成调整表单；保证本发明可直接实现操作目的的最终效果，无需再进行多余操作。所见即所得，十分直观。
24.s6：调整表单重新排序；对屏幕上显示的调整表单进行检测，赋予调整表单新的序号替换初始表单的序号，调整表单的序号与表单的坐标一一对应。
25.s7：表单确认无误后，保存表单，生成最终表单，完成改变表单的条目顺序操作。
26.本发明已由上述相关实施例加以描述，然而上述实施例仅为实施本发明的范例。必需指出的是，已揭露的实施例并未限制本发明的范围。相反地，在不脱离本发明的精神和范围内所作的更动与润饰，均属本发明的专利保护范围。

技术特征：

1.一种web在线表单实时调整条目顺序的方法，其特征在于：包括屏幕上显示的图形用户界面，所述图形用户界面包括显示区域、表单编辑区域；包括以下步骤：s1：检测初始表单，对初始表单的条目依次排序并获取表单的条目的坐标；s2：鼠标触发初始表单的编辑状态；s3：响应用户的拖动操作，移动目标条目；响应用户对目标条目的拖动操作，将目标条目做为浮窗的形式显示并随鼠标拖动；s4：鼠标停止的位置处预留编辑区域；s5：目标条目粘贴至编辑区域生成调整表单；s6：调整表单重新排序；s7：表单确认无误后，保存表单，生成最终表单。2.如权利要求1所述的一种web在线表单实时调整条目顺序的方法，其特征在于：步骤s1具体为：对屏幕上显示的初始表单进行检测，获取初始表单中的表单条目的数量，对表单条目依次排序，使表单条目与序号一一对应；表单条目的序号记为i；根据表单条目的序号循环获取对应的表单条目的坐标；所述表单条目的坐标包括条目的左上坐标、条目的左下坐标、条目的右上坐标以及条目的右下坐标；坐标是以表单编辑区域的左上角作为坐标原点（0,0），往右为x轴正方向，往下为y轴正方向建立的坐标系中的点坐标，坐标长度单位为像素。3.如权利要求2所述的一种web在线表单实时调整条目顺序的方法，其特征在于：步骤s2具体为：移动鼠标，使鼠标的光标位于目标条目的位置，鼠标按下左键保持2秒不松开，触发编辑控件，所述编辑控件获取光标的坐标并获取光标坐标落入的目标条目的坐标，用明显亮依次连接目标条目的左上坐标、目标条目的左下坐标、目标条目的右下坐标、目标条目的右上坐标以及目标条目的左上坐标构成条目边框，并在目标条目的头部显示编辑指示“请拖动至指定位置”；所述目标条目为所需要改变位置的表单条目。4.如权利要求3所述的一种web在线表单实时调整条目顺序的方法，其特征在于：步骤s3：具体包括：将编辑控件获取的光标的坐标作为拖动点q(x1,y1)，用户按下鼠标左键进行拖动，编辑控件实时获取光标的坐标q＇(x2,y2),计算偏移值，计算目标条目的实时坐标，使用目标条目的实时坐标替换目标条目的坐标。5.如权利要求4所述的一种web在线表单实时调整条目顺序的方法，其特征在于：计算偏移值包括：计算x方向的偏移值：λx= x2
‑ꢀ
x1；计算y方向的偏移值：λy= y2
‑ꢀ
y1；将目标条目的坐标同步偏移，偏移值与光标的坐标的偏移值相同，实现目标条目随鼠标移动；获取目标条目的左上坐标a(x3,y3)、目标条目的左下坐标b(x4,y4)、目标条目的右下
坐标c(x5,y5)、目标条目的右上坐标d(x6,y6)；随光标移动，将目标条目的坐标替换为：目标条目的左上坐标a (x3+λx,y3+λy)、目标条目的左下坐标b(x4+λx,y4+λy)、目标条目的右下坐标c(x5+λx,y5+λy)、目标条目的右上坐标d(x6+λx,y6+λy)。6.如权利要求3所述的一种web在线表单实时调整条目顺序的方法，其特征在于：步骤s4具体包括：s41：获取鼠标停止位置的表单条目的序号；首先获取鼠标停止位置的坐标并获取鼠标停止位置的坐标落入的表单条目的坐标及表单条目的序号；将鼠标停止位置的表单条目的序号记为m；s42：调整表单条目的坐标预留编辑区域；获取目标条目的序号并将其记为n；当m>n时，循环比较表单条目的序号i，将n<i≤m的序号i对应的表单条目的坐标依次替换为序号i-1表单条目的坐标，其他序号i的表单条目的坐标不变，将原序号m的表单条目处的位置空出作为编辑区域；当m<n时循环比较表单条目的序号i，将m≤i<n的序号i对应的表单条目的坐标依次替换为序号i+1表单条目的坐标，其他序号i的表单条目的坐标不变，将原序号m的表单条目处的位置空出编辑区域。7.如权利要求6所述的一种web在线表单实时调整条目顺序的方法，其特征在于：确认需要将条目顺序调整成当前状态后，松开鼠标左键，松开后，目标条目的坐标替换为原序号m的表单条目的坐标，生成所述调整表单；对屏幕上显示的调整表单进行检测，赋予调整表单新的序号替换初始表单的序号。8.如权利要求3所述的一种web在线表单实时调整条目顺序的方法，其特征在于：所述明显亮包括黄、橙。9.如权利要求2所述的一种web在线表单实时调整条目顺序的方法，其特征在于：i=1 、2、 3
…
。

技术总结

本发明提供一种web在线表单实时调整条目顺序的方法，包括屏幕上显示的图形用户界面，图形用户界面包括显示区域、表单编辑区域；包括以下步骤：检测初始表单，对初始表单的条目依次排序并获取表单的条目的坐标；鼠标触发初始表单的编辑状态；响应用户的拖动操作，移动目标条目；鼠标停止的位置处预留编辑区域；目标条目粘贴至编辑区域生成调整表单；调整表单重新排序；表单确认无误后，保存表单，生成最终表单。本发明通过显示操作的移动轨迹，能够让用户更加直观地看到所希望被拖动的表单条目被移动的位置以及最终效果，使得用户能够准确达到调整表单顺序的操作目标，通过交互方式可以更快速有效的完成调整顺序的操作。以更快速有效的完成调整顺序的操作。以更快速有效的完成调整顺序的操作。