混合型客户端界面实现方法及其系统的制作方法
【技术领域】
[0001] 本发明涉及数据显示技术，特别涉及混合型客户端界面实现方法及其系统。
【背景技术】
[0002] 为了更好的适应不同的需求，可以在一个客户端界面中嵌入多个页面片段来提升 客户端界面的灵活度。
[0003] 通常，一个webview组件用于承载一个页面片段。那么如图1所示，如果要实现不 连续的页面片段在同一客户端界面显示，则必须要使用多个webview组件。然而，本发明的 发明人发现，webview组件本身比较消耗资源（加载页面、获取数据、渲染页面），如果过多 的使用webview组件必会带来性能、体验上的下降，例如消耗内存造成卡或是加载时间长 等等。
【发明内容】
[0004] 本发明的目的在于提供一种混合型客户端界面实现方法及其系统，在确保客户端 界面的灵活度的同时，不会影响客户端的用户体验。
[0005] 为解决上述技术问题，本发明的实施方式公开了一种混合型客户端界面实现方 法，该客户端界面中包括至少两个页面片段和至少一个本地组件，该方法包括以下步骤：
[0006] 生成一个浏览器组件和至少一个本地组件；
[0007] 将至少两个页面片段组合成一个页面，并由该浏览器组件加载和显示，其中至少 两个页面片段分布在至少一个本地组件的两侧；
[0008] 将本地组件叠加于浏览器组件上方的指定位置，以形成客户端界面。
[0009] 本发明的实施方式还公开了一种混合型客户端界面实现系统，该客户端界面中包 括至少两个页面片段和至少一个本地组件，该系统包括：
[0010] 生成模块，用于生成一个浏览器组件和至少一个本地组件；
[0011] 组合模块，用于将至少两个页面片段组合成一个页面；
[0012] 加载模块，用于控制生成模块生成的浏览器组件加载和显示组合模块组合的页 面，其中至少两个页面片段分布在至少一个本地组件的两侧；以及
[0013] 叠加模块，用于将生成模块生成的本地组件叠加于浏览器组件上方的指定位置， 以形成客户端界面。
[0014] 本发明实施方式与现有技术相比，主要区别及其效果在于：
[0015] 在本发明中，将至少两个页面片段组合成一个页面，并由浏览器组件加载和显示， 然后将本地组件叠加于该浏览器组件上方的指定位置，以形成客户端界面，不但确保了客 户端界面的灵活度，而且不会影响客户端的用户体验。
[0016] 进一步地，根据本地组件的位置来调整浏览器组件中页面片段的位置和/或大 小，方便灵活。
[0017] 进一步地，更新客户端界面时，只需要加载和渲染一次新的网页页面即可，在不影 响用户体验的基础上，能够大大灵活客户端的展现能力。
[0018] 进一步地，能够使客户端界面同时显示不同业务内容，以更好地适应不同需求。
【附图说明】
[0019] 图1是现有的客户端界面的结构示意图；
[0020] 图2是现有的客户端界面实现方法的流程示意图；
[0021] 图3是本发明第一实施方式中一种混合型客户端界面实现方法的流程示意图；
[0022] 图4A-4C分别是本发明第一实施方式中一种混合型客户端界面的结构示意图；
[0023] 图5是本发明第二实施方式中一种混合型客户端界面的结构示意图；
[0024] 图6是本发明第二实施方式中一种混合型客户端界面实现方法的流程示意图；
[0025] 图7是本发明第三实施方式中一种混合型客户端界面实现系统的结构示意图。
【具体实施方式】
[0026] 在以下的叙述中，为了使读者更好地理解本申请而提出了许多技术细节。但是，本 领域的普通技术人员可以理解，即使没有这些技术细节和基于以下各实施方式的种种变化 和修改，也可以实现本申请各权利要求所要求保护的技术方案。
[0027] 为使本发明的目的、技术方案和优点更加清楚，下面将结合附图对本发明的实施 方式作进一步地详细描述。
[0028] 本发明第一实施方式涉及一种混合型客户端界面实现方法。图3是该混合型客户 端界面实现方法的流程示意图。该客户端界面中包括至少两个页面片段和至少一个本地组 件。可以理解，本地组件是在客户端本地实现界面的预制组件，包括编辑组件（Memo)、下拉 框组件（Combobox)、多选框组件、单选框组件、输入框组件（Edit)、标签组件（Label)等等， 但不包括浏览器组件。
[0029] 该方法包括以下步骤：
[0030] 在步骤301中，生成一个浏览器组件和至少一个本地组件。
[0031] 此后进入步骤302,将至少两个页面片段组合成一个页面，并由该浏览器组件加载 和显示，其中至少两个页面片段分布在至少一个本地组件的两侧。例如，如图4A所示，页面 片段1和页面片段2分别在本地组件2的上下侧；或是如图4B所示，页面片段1、页面片段 2和页面片段3分别在本地组件2的上侧、下侧和右侧；又或是如图4C所示，页面片段1、页 面片段2和页面片段3分别在本地组件2的左侧、右侧和下侧等等。
[0032] 优选地，各页面片段具有不同业务内容。能够使客户端界面同时显示不同业务内 容，以更好地适应不同需求。
[0033] 此外，可以理解，在本发明的其他实施方式中，各页面片段也可以是相同业务内 容。
[0034] 此后进入步骤303,将本地组件叠加于浏览器组件上方的指定位置，以形成客户端 界面。在本发明的一个优选例中，将本地组件叠加于浏览器组件上方的指定位置是指：将浏 览器组件中显示的页面作为背景，本地组件叠加在浏览器组件之上（遮盖掉浏览器组件的 一部分）。
[0035] 此后结束本流程。
[0036] 在本实施方式中，将至少两个页面片段组合成一个页面，并由浏览器组件加载和 显示，将本地组件叠加于该浏览器组件上方的指定位置，以形成客户端界面，不但确保了客 户端界面的灵活度，而且不会影响客户端的用户体验。
[0037] 本发明第二实施方式涉及一种混合型客户端界面实现方法。
[0038] 第二实施方式在第一实施方式的基础上进行了改进，主要改进之处在于：根据本 地组件的位置来调整浏览器组件中页面片段的位置和/或大小，方便灵活。具体地说：
[0039] 在步骤303之后还包括以下步骤：
[0040] 根据本地组件的位置来调整浏览器组件中页面片段的位置和/或大小。
[0041] 可以理解，在本发明的其他实施方式中，也可以根据浏览器组件中页面片段的位 置和/或大小来调整本地组件的位置，或者可以同时调整本地组件的位置和浏览器组件中 页面片段的位置和/或大小。
[0042] 优选地，根据本地组件的位置来调整浏览器组件中页面片段的位置和/或大小的 步骤中包括以下子步骤：
[0043] 判断本地组件的位置与页面片段的位置是否重叠或是否符合预定义的阈值；
[0044] 若本地组件的位置与页面片段的位置重叠或不符合预定义的阈值，则对页面片段 的位置和/或大小进行相应调整。
[0045] 可以理解，与传统的直接将本地组件和浏览器组件加载的网页页面一个个排布到 客户端界面上不同，由于本实施方式将多个页面片段组合成一个页面，并由浏览器组件加 载和显示，然后在该浏览器组件上方叠加本地组件，因此需要对页面片段的位置和/或大 小以及本地组件的位置进行调整，以使其均匀分布（例如页面片段与组件间隙在一范围 内，不能太大，也不能太小）。
[0046] 可选地，调整参数包括坐标和尺寸等等。可以理解，必要时，在调整其中一个页面 片段的同时，调整与该页面片段相关联的其他页面片段。当然，在本发明的其他实施方式 中，也可以使用其他参数对页面片段和本地组件进行调整。
[0047] 作为可选实施方式，该方法还可以包括以下步骤：
[0048] 需要更新客户端界面时，将至少两个页面片段组合成一个新的页面，并由浏览器 组件