页面调整方法、装置、计算机系统及可读存储介质制造方法及图纸

本公开提供了一种页面调整方法、装置、计算机系统及可读存储介质，可用于物联网、电子技术领域或其他领域。其中，该方法包括：获取初始设计页面的页面度量信息和当前设备屏幕的屏幕度量信息；根据页面度量信息和屏幕度量信息，确定初始设计页面和当前设备屏幕之间的基准比例信息；以及根据页面展示属性信息和基准比例信息，将初始设计页面调整为适配当前设备屏幕的目标页面。屏幕的目标页面。屏幕的目标页面。

【技术实现步骤摘要】
页面调整方法、装置、计算机系统及可读存储介质


[0001]本公开涉及物联网、电子
，更具体地，涉及一种页面调整方法、装置、计算机系统及可读存储介质。

技术介绍

[0002]在移动端应用开发流程中，通常由UI(User Interface，用户界面)设计人员将一套带有尺寸标注的设计稿交给移动端开发人员，移动端开发人员根据设计稿上的尺寸进行页面组件布局以及处理逻辑代码的编写工作，使得设计稿能够适配移动端屏幕尺寸。
[0003]在实现本公开构思的过程中，专利技术人发现相关技术中至少存在如下问题：不同移动端设备的屏幕尺寸不同，页面与屏幕适配困难。

技术实现思路

[0004]有鉴于此，本公开提供了一种页面调整方法、装置、计算机系统及可读存储介质。
[0005]本公开的一个方面提供了一种页面调整方法，包括：获取初始设计页面的页面度量信息和当前设备屏幕的屏幕度量信息；根据所述页面度量信息和所述屏幕度量信息，确定所述初始设计页面和所述当前设备屏幕之间的基准比例信息；以及根据页面展示属性信息和所述基准比例信息，将所述初始设计页面调整为适配所述当前设备屏幕的目标页面。
[0006]本公开的另一个方面提供了一种页面调整装置，包括：第一获取模块，用于获取初始设计页面的页面度量信息和当前设备屏幕的屏幕度量信息；确定模块，用于根据所述页面度量信息和所述屏幕度量信息，确定所述初始设计页面和所述当前设备屏幕之间的基准比例信息；以及调整模块，用于根据页面展示属性信息和所述基准比例信息，将所述初始设计页面调整为适配所述当前设备屏幕的目标页面。
[0007]本公开的另一方面提供了一种计算机系统，包括：一个或多个处理器；存储器，用于存储一个或多个程序，其中，当所述一个或多个程序被所述一个或多个处理器执行时，使得所述一个或多个处理器实现本公开所述的页面调整方法。
[0008]本公开的另一方面提供了一种计算机可读存储介质，其上存储有计算机可执行指令，所述指令在被执行时用于实现本公开所述的页面调整方法。
[0009]本公开的另一方面提供了一种计算机程序产品，所述计算机程序产品包括计算机可执行指令，所述指令在被执行时用于实现本公开所述的页面调整方法。
[0010]根据本公开的实施例，通过采用了根据页面度量信息和屏幕度量信息，确定初始设计页面和当前设备屏幕之间的基准比例信息，以及根据页面展示属性信息和基准比例信息，将初始设计页面调整为适配当前设备屏幕的目标页面的技术手段，由于只需要根据页面展示属性信息和基准比例信息，便可自动完成屏幕适配，所以至少部分地克服了不同终端设备的屏幕尺寸不同导致的页面与屏幕适配困难的技术问题，减少了屏幕适配的工作量，提高了开发效率。
附图说明
[0011]通过以下参照附图对本公开实施例的描述，本公开的上述以及其他目的、特征和优点将更为清楚，在附图中：
[0012]图1示意性示出了根据本公开实施例的可以应用页面调整方法的示例性系统架构；
[0013]图2示意性示出了根据本公开实施例的页面调整方法的流程图；
[0014]图3示意性示出了根据本公开实施例的页面调整方法应用于安卓类设备和苹果类设备时的流程图；
[0015]图4A示意性示出了根据本公开实施例的初始设计页面在适配第一设备屏幕时的展示效果图；
[0016]图4B示意性示出了根据本公开实施例的初始设计页面在适配第二设备屏幕时的展示效果图；
[0017]图5示意性示出了根据本公开的实施例的页面调整装置的框图；以及
[0018]图6示意性示出了根据本公开实施例的适于实现页面调整方法的计算机系统的框图。
具体实施方式
[0019]以下，将参照附图来描述本公开的实施例。但是应该理解，这些描述只是示例性的，而并非要限制本公开的范围。在下面的详细描述中，为便于解释，阐述了许多具体的细节以提供对本公开实施例的全面理解。然而，明显地，一个或多个实施例在没有这些具体细节的情况下也可以被实施。此外，在以下说明中，省略了对公知结构和技术的描述，以避免不必要地混淆本公开的概念。
[0020]在此使用的术语仅仅是为了描述具体实施例，而并非意在限制本公开。在此使用的术语“包括”、“包含”等表明了所述特征、步骤、操作和/或部件的存在，但是并不排除存在或添加一个或多个其他特征、步骤、操作或部件。
[0021]在此使用的所有术语(包括技术和科学术语)具有本领域技术人员通常所理解的含义，除非另外定义。应注意，这里使用的术语应解释为具有与本说明书的上下文相一致的含义，而不应以理想化或过于刻板的方式来解释。
[0022]在使用类似于“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的系统等)。
[0023]移动端开发人员基于文字流式、控件弹性、图片等比缩放等准则进行页面视图的开发。为达到页面视图与移动端设备屏幕适配的效果，在安卓平台采用的开发方案包括：编写脚本将页面视图的长度转换成适配各种设备屏幕的分辨率的长度。修改安卓控件的DisplayMetrics属性的density值，从而修改控件的长宽像素值。在苹果平台采用的开发方
案包括：采用自动布局的方式进行画面布局，通过设定控件的宽度、高度，与其他的控件的相对位置等进行控件布局。适配方案主要是使用UI图尺寸
×
屏幕比例的方式设置控件的长、宽约束，从而达到在小屏幕上缩小，在大屏幕上放大的效果。
[0024]专利技术人在实现本公开构思的过程中发现，编写脚本的方式需要在脚本中穷举所有机型的分辨率，该方案难以覆盖市面上的所有机型的分辨率。修改安卓控件的density值的方式会出现系统刷新时desity值被还原的情况。自动布局的方式需要在所有设置约束的地方都乘以屏幕比例系数，代码繁琐而且增加了开发人员的工作量。也即，上述方案存在机型覆盖率低、不稳定、开发量大等缺点。此外，由于安卓系统开源定制化的原因，安卓手机的碎片化问题更加严重。
[0025]本公开的实施例提供了一种页面调整方法、装置、计算机系统及可读存储介质。该方法包括：获取初始设计页面的页面度量信息和当前设备屏幕的屏幕度量信息。根据页面度量信息和屏幕度量信息，确定初始设计页面和当前设备屏幕之间的基准比例信息。根据页面展示属性信息和基准比例信息，将初始设计页面调整为适配当前设备屏幕的目标页面。
[0026]图1示意性示出了根据本公开实施例的可以应用页面调整方法本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种页面调整方法，包括：获取初始设计页面的页面度量信息和当前设备屏幕的屏幕度量信息；根据所述页面度量信息和所述屏幕度量信息，确定所述初始设计页面和所述当前设备屏幕之间的基准比例信息；以及根据页面展示属性信息和所述基准比例信息，将所述初始设计页面调整为适配所述当前设备屏幕的目标页面。2.根据权利要求1所述的方法，其中，所述初始设计页面包括至少一个第一页面组件；所述方法还包括：针对每个所述第一页面组件，获取所述第一页面组件对应的页面配置信息；以及根据所述页面配置信息，获取与所述第一页面组件相关的页面展示属性信息。3.根据权利要求1所述的方法，其中，所述页面展示属性信息包括展示度量信息，所述展示度量信息表征所述初始设计页面与所述当前设备屏幕的适配比例信息；所述根据页面展示属性信息和所述基准比例信息，将所述初始设计页面调整为适配所述当前设备屏幕的目标页面包括：将所述基准比例信息转换为像素级基准比例信息；将所述像素级基准比例信息赋值给所述展示度量信息，得到与所述初始设计页面相关的适配所述当前设备屏幕的目标展示度量信息；以及根据所述目标展示度量信息，将所述初始设计页面调整为适配所述当前设备屏幕的目标页面。4.根据权利要求1所述的方法，其中，所述初始设计页面中包括第二页面组件和第三页面组件，所述页面展示属性信息包括表征所述第二页面组件和所述第三页面组件之间的相对位置关系的第一约束值信息；所述根据页面展示属性信息和所述基准比例信息，将所述初始设计页面调整为适配所述当前设备屏幕的目标页面包括：根据所述基准比例信息，对所述初始设计页面对应的页面组件配置方法中定义的所述第一约束值信息进行更新，得到第一更新后约束值信息；以及根据包括所述第一更新后约束值信息的页面组件配置方法，将所述初始设计页面调整为适配所述当前设备屏幕的目标页面。5.根据权利要求1或4所述的方法，其中，所述初始设计页面中包括文本视图组件，所述页面展示属性信...

【专利技术属性】
技术研发人员：党亚林，周生宁，苗志高，俎旭，
申请(专利权)人：工银科技有限公司，
类型：发明
国别省市：