一种页面布局动态切换方法及系统.pdf

本发明公开了一种页面布局动态切换方法，包括：设置至少两个页面布局方案，并保存各页面布局方案配置信息，该配置信息包括页面布局中控件的位置及大小信息；建立各业务流程环节与所述页面布局方案的映射关系；当业务流程进入下一环节，基于所述映射关系加载下一业务流程环节对应的页面布局方案配置信息，得到所需页面布局。本发明还提供相应的系统。根据本发明将不同的流程环节与所配置的页面布局方案映射及灵活绑定，页面定义灵活性和复用度高，实现在不同的业务流程环节中的页面布局的动态切换，便于业务操作人员完成业务流程中页面布局的定制，以较低的成本和高效率满足在工作流处理中页面布局控制个性化需求。

1、  一种页面布局动态切换方法，其特征在于，包括：
设置至少两个页面布局方案，并保存各页面布局方案配置信息，该配置信息包括页面布局中控件的位置及大小信息；
建立各业务流程环节与所述页面布局方案的映射关系；
当业务流程进入下一环节，基于所述映射关系加载下一业务流程环节对应的页面布局方案配置信息，得到所需页面布局。

2、  如权利要求1所述的页面布局动态切换方法，其特征在于，所述设置页面布局方案，具体包括：
获取页面上所有控件的位置信息和尺寸；
调整页面上至少一个控件的位置和/或尺寸并保存，得到新的页面布局方案。

3、  如权利要求2所述的页面布局动态切换方法，其特征在于，所述设置页面布局方案，还包括：
删除页面上至少一个控件，保存删除控件后的页面布局方案配置信息，得到新的页面布局方案。

4、  如权利要求1所述的页面布局动态切换方法，其特征在于，
建立各业务流程环节与所述页面布局方案的映射关系，具体包括：
根据业务流程环节的需求，将该业务流程环节与所设置的页面布局方案中至少之一绑定，并保存业务流程环节及其对应的页面布局方案配置信息。

5、  如权利要求1所述的页面布局动态切换方法，其特征在于，
所述加载业务流程环节对应的页面布局方案配置信息，具体包括：
根据页面布局方案中控件的位置信息和尺寸生成所述业务流程环节对应的页面。

6、  一种页面布局动态切换系统，其特征在于，包括：
页面布局设置单元，用于设置至少两个页面布局方案，并保存各页面布局方案配置信息，该配置信息包括布局中控件的位置及大小信息；
映射单元，用于建立各业务流程环节与所述页面布局方案的映射关系；
页面生成单元，用于基于所述映射关系加载将进入的业务流程下一环节对应的页面布局方案配置信息，得到所述下一业务流程环节对应的页面布局。

7、  如权利要求6所述的页面布局动态切换系统，其特征在于，所述页面布局设置单元包括：
控件信息获取模块，用于获取页面上所有控件的位置信息和尺寸；
控件处理模块，用于调整页面上至少一个控件的位置和/或尺寸并保存，得到新的页面布局方案。

8、  如权利要求6所述的页面布局动态切换系统，其特征在于，所述页面布局设置单元还包括：
控件删除模块，用于删除页面上的控件，并保存删除控件后的页面布局方案配置信息，得到新的页面布局方案。

9、  如权利要求6所述的页面布局动态切换系统，其特征在于，所述映射单元，包括：
绑定模块，用于根据业务流程环节的需求，将该业务流程环节与所设置的页面布局方案中至少之一绑定；
存储模块，用于保存业务流程环节及其对应的页面布局方案配置信息。

一种页面布局动态切换方法及系统
技术领域
本发明涉及信息技术领域，具体涉及一种页面布局动态切换方法及系统。
背景技术
在不同的流程环节，业务处理人员关注的信息内容有所不同，给不同的业务处理人员展示时，需要展示的信息会有所区别，比如预算审批单，在初级审批时，审批人员没有权利看到本公司的预算、可用余额等信息，因此，在不同的流程状态环节要求采用不同的页面布局，需要根据流程状态环节进行页面布局切换，以适应业务需求。
现有的页面布局切换，通常是在某工作流活动状态中，通过程序编码，重新制作页面，达到页面信息内容的切换。通过此硬编码方式制作的页面，只能用于该活动中，不能应用于其他工作流活动，且该活动页面如需调整，需重新制作页面。
现有技术中的一种实现页面布局切换的方案中需要基于源代码，在客户现场通过二次开发完成，通常需在页面上提供二次开发接口，通过宏语言硬编码实现。
将不同的应用场景下的页面元素放在不同的页签或容器上，根据预先设定的业务规则进行加载显示；再根据已经定义的流程的环节，对布局元素进行调整，得到不同页面布局。
现有技术提供的技术方案需要源代码，针对不同的客户需要在客户现场二次开发，成本较高。
通过硬编码实现页面布局调整，需要专业程序开发人员，不便于用户操作使用。在业务流程的不同环节对页面信息所需不同的业务场景的情况下，无法通过简单配置动态完成；流程活动的布局没有形成方案级的存储，无法对不同流程环节进行动态配置重新组合，复用度低。
发明内容
本发明实施例提供了一种页面布局动态切换方法及系统，实现在不同的业务流程环节中的页面布局的动态切换，便于操作使用。
本发明实施例提供的一种页面布局动态切换方法，包括：
设置至少两个页面布局方案，并保存各页面布局方案配置信息，该配置信息包括页面布局中控件的位置及大小信息；
建立各业务流程环节与所述页面布局方案的映射关系；
当业务流程进入下一环节，基于所述映射关系加载下一业务流程环节对应的页面布局方案配置信息，得到所需页面布局。
本发明实施例提供的一种页面布局动态切换系统，包括：
页面布局设置单元，用于设置至少两个页面布局方案，并保存各页面布局方案配置信息，该配置信息包括布局中控件的位置及大小信息；
映射单元，用于建立各业务流程环节与所述页面布局方案的映射关系；
页面生成单元，用于基于所述映射关系加载将进入的业务流程下一环节对应的页面布局方案配置信息，得到所述下一业务流程环节对应的页面布局。
本发明实施例提供的页面布局动态切换方法及系统，根据需要预先配置各种不同的页面布局方案，将不同的流程环节与所配置的页面布局方案映射及灵活绑定，页面定义灵活性和复用度高，实现在不同的业务流程环节中的页面布局的动态切换，便于业务操作人员完成业务流程中页面布局的定制，以较低的成本和高效率满足在工作流处理中页面布局控制个性化需求。
附图说明
图1为本发明实施例提供的一种页面布局动态切换方法流程图；
图2为本发明实施例中的一工作流程环节的页面布局示意图；
图3为本发明实施例中的控件信息表格；
图4为本发明实施例提供的一工作流程环节对应页面中控件列表示意图；
图5为本发明实施例提供的另一工作流程环节对应页面中控件列表示意图；
图6为本发明实施例提供的页面中控件列表与指定流程环节进行映射关系示意图；
图7为本发明实施例中的流程环节与布局方案的映射关系示意图；
图8为本发明实施例中的另一工作流程环节的页面布局示意图
图9为本发明实施例中提供的页面布局动态切换系统架构图。
具体实施方式
鉴于现有技术中的不足，本发明提供一种基于业务流程驱动的页面布局动态切换方法，在进行页面的工作流处理时，用户可根据具体的业务流程环节，可使用不同的页面布局来加载不同的信息。在不改动源代码的情况下，实现页面布局动态切换并根据流程的活动环节进行自动装载，页面布局配置的整个过程易于理解，便于操作使用。
为便于理解，首先简要介绍页面布局及其切换的实现原理。
实现页面布局切换的系统，包括：页面布局平台，页面配置信息存储装置，页面布局生成器，以及页面显示装置。
首先，将页面布局的元素用元数据文件形式来表示(形式可以为一种XML文件信息)，页面布局平台负责对页面配置文件的维护修改管理，比如，将默认方案Y修改为方案Y1，存储到服务端，通过布局生成器对页面配置文件各属性进行解析识别，再根据转换规则在布局展示容器中展现为可视的页面布局方案；其次，再将业务流程的活动环节属性通过传入值与页面布局的配置文件进行绑定，在运行期，工作流的活动环节首先判断是否有对应绑定的页面布局方案Y1，如有则加载该方案Y1，如没有则加载默认方案Y，通过布局生成器将对应方案可视化呈现为布局展示容器中。
页面布局平台：用于获取不同页面容器(凭证，采购单，报销单)页面的布局，并初始化各容器控件布局信息为初始化配置文件，维护存储页面配置文件(包括初始化配置文件及通过表格布局设计器修改后的配置文件)。维护管理页面配置文件，可通过可视化的布局平台修改控件的位置和大小，比如将控件的<constraints>0，0，1013，629</constraints>(其中数字分别表示控件位置信息：横坐标x，纵坐标y，控件的宽度width(像素数量)及高度height(像素数量))修改为：
<constraints>200，200，1026，1258</constraints>，以及其他的用户界面，也称人机界面(UI，User Interface)属性如显示名称(name)，编辑属性(herited)等，保存作为另一个页面布局配置文件。页面布局配置的整个过程易于理解，便于用户操作使用。
页面布局配置信息存储装置：用于存储页面布局的元数据配置文件，元数据配置文件中描述了该页面布局的各个元素的UI属性和信息，是一个元数据的片段信息文件。
页面生成器：根据工作流引擎对应活动环节所绑定的页面布局方案去加载对应的页面布局文件，按指定的规则解析识别元数据文件，转换到可视化的布局展示容器，实现了根据不同流程环节动态切换页面布局。
在系统中初始化建立业务流程环节与页面布局方案的映射关系(一对多)，系统通过所选的业务单元类型，通过映射关系，遍历对应的布局方案，过滤出该业务流程环节所映射的布局方案配置信息以供进一步选择。
页面表格布局设计器通常以表格的形式对页面布局区域进行划分，以列表的形式进行展现，用户只需要简单的调整列表的顺序，就可以完成页面的布局，修改控件的位置和大小信息。
页面表格布局设计器根据页面上控件相对于容器的位置信息(XY值)，通过表格生成算法，把页面布局区域划分为一个包含多行多列的表格，每个控件位于表格的格子区域，并根据大小信息，占据一个或多个格子。通过从左到右、从上到下的顺序，把表格的所有格子转换成列表进行展示。用户可根据需要进行页面布局，调整列表上控件的前后顺序和所占的列数，形成新的列表；在保存布局时，列表又重新同步表格数据，根据格子所在行和列的位置信息，以及格子所占的列数，重新设置控件的位置和大小信息。
本发明实施例提供的一种页面布局动态切换方法，包括：
S01，设置至少两个页面布局方案，并保存各页面布局方案配置信息，该配置信息包括布局中控件的位置及大小信息；
设置页面布局方案，具体包括：
获取页面上所有控件的位置信息和尺寸；
调整页面上至少一个控件的位置和/或尺寸并保存，得到相应的页面布局方案。
另外，还可以删除页面上至少一个控件并保存，得到相应的页面布局方案。
S02，建立各业务流程环节与所述页面布局方案的映射关系；
根据业务流程环节的需求，将该业务流程环节与所设置的页面布局方案中至少之一绑定，并保存业务流程环节及其对应的页面布局方案配置信息。
S03，当业务流程进入下一环节，基于所述映射关系加载下一业务流程环节对应的页面布局方案配置信息，得到所需页面布局。
具体包括：
根据页面布局方案中控件的位置信息和尺寸生成所述业务流程环节对应的页面。
下面结合具体实施例对本发明的实现方案进行进一步说明。
本实施例以财务管理流程为例描述如何进行页面切换。
参照图1，本发明实施例提供的一种页面布局动态切换方法，包括：
S101，根据具体要求生成多个页面布局方案，并保存各页面布局方案配置信息，该配置信息包括页面布局中控件的位置及大小信息；
首先，以表格的形式对页面布局区域进行划分，以列表的形式进行展现，只需要简单的调整列表的顺序，就可以完成页面的布局，修改控件的位置和大小信息。
根据页面上控件相对于容器的位置信息(横坐标X，纵坐标Y)，通过表格生成算法，将页面布局区域划分为一个包含多行多列的表格，每个控件位于表格的格子区域，并根据大小信息，占据一个或多个格子。通过从左到右、从上到下的顺序，把表格的所有格子转换成列表进行展示。进行页面布局时，调整列表上控件的前后顺序和所占的列数，形成新的列表；新的列表与不同的业务流程环节进行映射绑定，在保存布局后，不同的业务流程环节加载对应绑定的列表方案，列表又重新同步表格数据，根据格子所在行和列的位置信息，以及格子所占的列数，重新设置控件的位置和大小信息，得到不同的页面布局方案。
本实施例中表格生成算法如下：
1)创建一个空表格；
2)通过元数据文件所记录的控件信息，遍历页面上的所有控件，读取控件的位置和大小信息；
3)将控件放在表格的格子中：
3a.根据控件位置的X值，获取控件所在的行；如果获取不到，在表格中添加控件所在的行；
3b.根据控件位置的Y值，获取控件所在的列；如果获取不到，在表格中添加控件所在的列；
3c.从以上的行和列信息，把控件放在表格对应的格子中。
4)根据控件的大小信息，设置控件所占的行数和列数。
图2所示为本发明实施例中的一审批环节的默认页面(收款单)，其中包括有单据编码，单据名称，收付款单位，账户，本次金额等条目(即控件内容)。
在后续的核销环节需要调整页面布局，并且可屏蔽掉预算余额和累计金额信息，使其在同一条流程的另一个环节(核销)中展现。通过切换页面布局可便于操作以及提高业务数据的安全性。
遍历标准页面上的所有控件，将控件放在表格的格子中。
例如，获取单据编码控件的位置(20，20)，在表格中找不到对应的行和列，新增一行一列，并将控件放在对应格子中，形成一个1行1列的表格。
获取单据名称控件的位置(80，20)，在表格中找到所在的行(第一行)，找不到对应的列，新增一列，并将控件放在对应格子中，形成一个1行2列的表格。
继续遍历其余所有控件，将控件逐个放在表格的格子中，形成一个5行6列的控件信息表格，如图3所示。
表格转换成列表步骤如下：
(1)从左到右的顺序遍历表格所有行；
(2)从上到下的顺序遍历表格所有列；
(3)把当前行和列的表格格子的控件添加到列表中。
基于之前生成的表格，通过列表转换算法得到控件列表y1，如图4所示。
调整列表中控件元素的顺序，可以得到新的列表。例如将付款相关控件与收款相关控件布局顺序进行交换，并可从列表中删除预算余额和累计金额，得到列表Y2，如图5所示。
S102，建立各业务流程环节与所述页面布局方案的映射关系；
根据业务流程环节的需求，将该业务流程环节与所设置的页面布局方案中至少之一绑定，并保存业务流程环节及其对应的页面布局方案配置信息。
流程环节与页面布局绑定如下：
将修改后的控件列表与指定流程环节进行映射绑定；例如，将Y2列表与“核销”环节映射，如图6所示。
各个流程环节是确定加载页面布局列表的前置状态，通过映射指定形成页面在流程中的环节与所需加载的列表方案的映射表，如不指定，则该环节加载标准布局页面Y1，最后形成的流程环节与加载方案的映射表如图6所示。
S103，基于所述映射关系加载业务流程环节对应的页面布局方案配置信息，得到所需页面布局。
当业务流程进入下一环节(核销)，通过该页面的上下文环境信息，通过映射表获取该前置状态下所需加载的流程环节(核销)对应的布局列表Y2。
遍历控件列表的所有控件；从左到右的顺序遍历表格所有行；从上到下的顺序遍历表格所有列；将当前控件放在表格当前行和列的格子中。此时核销环节的，页面布局如图8所示。
参照图9，本发明实施例提供的一种页面布局动态切换系统900，包括：
页面布局设置单元91，用于设置至少两个页面布局方案，并保存各页面布局方案配置信息，该配置信息包括布局中控件的位置及大小信息；
映射单元92，用于建立各业务流程环节与所述页面布局方案的映射关系；
页面生成单元93，用于基于所述映射关系加载将进入的业务流程下一环节对应的页面布局方案配置信息，得到所述下一业务流程环节对应的页面布局。
其中，页面布局设置单元91包括：
控件信息获取模块91a，用于获取页面上所有控件的位置信息和尺寸；
控件处理模块91b，用于调整页面上至少一个控件的位置和/或尺寸并保存，得到新的页面布局方案。
控件删除模块91c，用于删除页面上的控件，并保存删除控件后的页面布局方案配置信息，得到新的页面布局方案。
其中，映射单元92，包括：
绑定模块92a，用于根据业务流程环节的需求，将该业务流程环节与所设置的页面布局方案中至少之一绑定；
存储模块92b，用于保存业务流程环节及其对应的页面布局方案配置信息。
本发明实施例提供的页面布局动态切换方法及系统，根据需要预先配置各种不同的页面布局方案，将不同的流程环节与所配置的页面布局方案映射及灵活绑定，页面定义灵活性和复用度高，实现在不同的业务流程环节中的页面布局的动态切换，便于业务操作人员完成业务流程中页面布局的定制，以较低的成本和高效率满足在工作流处理中页面布局控制个性化需求。
以上所述仅为本发明的示范性实施方案而已，并非用于限定本发明的保护范围。凡在本发明的精神和原则之内所作的任何修改、等同替换、改进等，均包含在本发明的保护范围内。