CN109783181B - 屏幕适配显示方法、电子设备及计算机存储介质 - Google Patents

Abstract

本发明实施例公开了一种屏幕适配显示方法、电子设备及计算机存储介质，用于调整页面布局以适配屏幕显示。其中方法包括：获取当前屏幕待显示页面的预设布局模板；检测当前屏幕的屏幕长宽比与预设布局模板的标准长宽比是否一致；若屏幕长宽比与标准长宽比不一致，则依据屏幕长宽比、标准长宽比以及预设布局模板所包括的界面元素数量，调整待显示页面的页面布局，以适配当前屏幕进行显示。由此可见，本发明方案可以通过对页面布局的调整，实现待显示页面在当前屏幕的适配显示，避免页面中出现大量空白或不能完全显示的现象，从而提高页面信息显示的有效性、页面显示的美观性以及不同屏幕规格智能设备所属用户的用户体验。

Description

屏幕适配显示方法、电子设备及计算机存储介质

技术领域

本发明实施例涉及计算机技术领域，具体涉及一种屏幕适配显示方法、电子设备及计算机存储介质。

背景技术

随着智能设备配合计算机技术的快速发展，基于不同屏幕规格的智能设备越来越普及于大众。

目前，不同屏幕规格的智能设备在现有市场当中的占有率不同。相应的，各类软件例如电子书等，通常会基于主流屏幕规格的智能设备而对用户界面进行设计，得到主流屏幕规格对应页面布局模板，从而以该页面布局模板为标准，在各类智能设备上进行显示。

其中，主流屏幕规格的智能设备基于对应页面布局模板可以得到屏幕适配显示。然而，其他屏幕规格的智能设备无法依据主流屏幕规格对应页面布局模板进行适配显示，进而影响页面信息的有效显示，降低页面显示的美观性以及不同屏幕规格智能设备所属用户的用户体验。

发明内容

鉴于上述问题，提出了本发明实施例以便提供一种克服上述问题或者至少部分地解决上述问题的屏幕适配显示方法、电子设备及计算机存储介质。

根据本发明的一个方面，提供了一种屏幕适配显示方法，用于调整页面布局以适配屏幕显示，该方法包括：获取当前屏幕待显示页面的预设布局模板；检测所述当前屏幕的屏幕长宽比与所述预设布局模板的标准长宽比是否一致；若所述屏幕长宽比与所述标准长宽比不一致，则依据所述屏幕长宽比、所述标准长宽比以及所述预设布局模板所包括的界面元素数量，调整待显示页面的页面布局，以适配所述当前屏幕进行显示。

根据本发明的另一方面，提供了一种电子设备，包括：处理器、存储器、通信接口和通信总线，处理器、存储器和通信接口通过通信总线完成相互间的通信；存储器用于存放至少一可执行指令，可执行指令使处理器执行以下操作：获取当前屏幕待显示页面的预设布局模板；检测所述当前屏幕的屏幕长宽比与所述预设布局模板的标准长宽比是否一致；若所述屏幕长宽比与所述标准长宽比不一致，则依据所述屏幕长宽比、所述标准长宽比以及所述预设布局模板所包括的界面元素数量，调整待显示页面的页面布局，以适配所述当前屏幕进行显示。

根据本发明的又一方面，提供了一种计算机存储介质，存储介质中存储有至少一可执行指令，可执行指令使处理器执行以下操作：获取当前屏幕待显示页面的预设布局模板；检测所述当前屏幕的屏幕长宽比与所述预设布局模板的标准长宽比是否一致；若所述屏幕长宽比与所述标准长宽比不一致，则依据所述屏幕长宽比、所述标准长宽比以及所述预设布局模板所包括的界面元素数量，调整待显示页面的页面布局，以适配所述当前屏幕进行显示。

根据本发明的屏幕适配显示方法、电子设备及计算机存储介质，在进行页面显示之前，获取待显示页面的预设页面布局模板，通过对当前屏幕的屏幕长宽比与预设布局模板关联适配的标准屏幕长宽比进行比较，在确定不一致时，基于当前屏幕的屏幕长宽比、预设布局模板关联适配的标准长宽比以及预设布局模板所包括的界面元素数量，对待显示页面的页面布局进行调整，以适配当前屏幕进行显示。利用本实施例的屏幕适配显示方法，可以在页面布局模板与当前屏幕不适配的情况下，通过对页面布局的调整，实现了待显示页面在当前屏幕的适配显示，避免了页面中出现大量空白或不能完全显示的现象，从而提高了页面信息显示的有效性、页面显示的美观性以及不同屏幕规格智能设备所属用户的用户体验。

上述说明仅是本发明实施例技术方案的概述，为了能够更清楚了解本发明实施例的技术手段，而可依照说明书的内容予以实施，并且为了让本发明实施例的上述和其它目的、特征和优点能够更明显易懂，以下特举本发明实施例的具体实施方式。

附图说明

通过阅读下文优选实施方式的详细描述，各种其他的优点和益处对于本领域普通技术人员将变得清楚明了。附图仅用于示出优选实施方式的目的，而并不认为是对本发明的限制。而且在整个附图中，用相同的参考符号表示相同的部件。在附图中：

图1示出了本发明实施例一提供的一种屏幕适配显示方法的流程图；

图2示出了本发明实施例一提供的页面布局调整的示例图；

图3示出了本发明实施例二提供的一种屏幕适配显示方法的流程图；

图4示出了本发明实施例二提供的页面布局调整的另一示例图；

图5示出了本发明实施例二提供的页面布局调整的另一示例图；

图6示出了本发明实施例二提供的页面布局调整的另一示例图；

图7示出了本发明实施例二提供的页面布局调整的另一示例图；

图8示出了本发明实施例三提供的一种屏幕适配显示方法的流程图；

图9示出了本发明实施例五提供的一种电子设备的结构示意图。

具体实施方式

下面将参照附图更详细地描述本公开的示例性实施例。虽然附图中显示了本公开的示例性实施例，然而应当理解，可以以各种形式实现本公开而不应被这里阐述的实施例所限制。相反，提供这些实施例是为了能够更透彻地理解本公开，并且能够将本公开的范围完整的传达给本领域的技术人员。

实施例一

图1示出了本发明实施例一提供的一种屏幕适配显示方法的流程图，用于调整页面布局以适配屏幕显示。如图1所示，该方法包括以下步骤：

步骤S101，获取当前屏幕待显示页面的预设布局模板。

在本发明具体实施例中，当前屏幕是指用户所持电子设备进行页面显示的屏幕。通过对电子设备的系统接口，可以获得当前屏幕的属性信息。其中，当前屏幕的属性信息可以包括屏幕分辨率以及屏幕比例等长宽比信息。

本实施例中，待显示页面是指电子设备屏幕当前即将显示但并未显示出来的页面。待显示页面可以为应用程序所关联的任何显示页面，页面中可以包括各种形式的界面元素。相应的，预设布局模板是指应用程序后台开发人员预先设计的页面布局模板。预设布局模板以预先指定的屏幕分辨率为基准，例如当下主流的分辨率，在预设布局模板中，预先设计了页面中各界面元素所显示的具体内容、界面元素的显示位置以及各界面元素之间的间隔等布局设计。从而电子设备可以通过调用预设布局模板，按照预设布局模板中规定的页面布局进行关联页面的显示。

具体的，在当前屏幕即将显示待显示页面时，电子设备可以从服务端获取待显示页面的预设布局模板。或者，预设布局模板可以在应用程序的安装时，预先保存在电子设备的本地存储中，从而电子设备可以从本地存储中获取待显示页面的预设布局模板。

步骤S102，检测当前屏幕的屏幕长宽比与预设布局模板的标准长宽比是否一致。

在本发明具体实施例中，长宽比是指屏幕宽度和高度之间的比例，还可以称为纵横比或屏幕比例，通常由屏幕的较长长度与较短长度之间的比值来表示，可以根据屏幕物理分辨率计算得到。长屏是指屏幕的纵向长度明显超过横向长度的屏幕，宽屏是指屏幕的横向长度明显超过纵向长度的屏幕。不同屏幕在长宽比相同的情况下，其分辨率不一定相同。例如，根据现有电子设备所采用的屏幕，屏幕长宽比可以包括16:9或19:9等，相应的，屏幕分辨率分可以为1080×1920或1080×2280，但不限于此。其中针对1080×1920分辨率，表示屏幕水平方向含有像素数量为1080个，竖直方向含有像素数量为1920个。

本实施例中，以屏幕或画面正常显示为基准，确定纵向长度与横向长度的比值来表示长宽比。相应的，当前屏幕的屏幕长宽比是指当前屏幕正常显示时，例如竖屏或横屏，屏幕的纵向长度与横向长度的比值。由于预设布局模板适配于指定的屏幕长宽比或屏幕分辨率，例如当前主流的屏幕，因此将预设布局模板所适配的屏幕长宽比称为标准长宽比，将预设布局模板所适配的屏幕分辨率称为标准分辨率。

具体的，针对当前电子设备的当前屏幕，可以通过系统接口获取当前屏幕的屏幕信息，获取屏幕长宽比，或者根据屏幕分辨率及屏幕显示方向确定屏幕长宽比。针对预设布局模板，可以获取预设布局模板所适配的标准长宽比，或者根据预设布局模板所适配的屏幕分辨率确定标准长宽比。并将屏幕长宽比与标准长宽比进行比较，判断当前屏幕的屏幕长宽比是否符合标准长宽比。

其中，若当前屏幕的屏幕长宽比与标准长宽比不一致，则可以通过下述页面布局的调整方式对预设布局模板进行调整，以适配当前屏幕显示待显示页面。若当前屏幕的屏幕长宽比与标准长宽比一致，则可以进一步确定当前屏幕的屏幕分辨率是否符合标准分辨率。若屏幕分辨率与标准分辨率不一致，则可以通过页面整体布局的调整方式对预设布局模板进行调整，以适配当前屏幕显示待显示页面；若屏幕分辨率与标准分辨率一致，则可以直接进行待显示页面的显示。

步骤S103，若屏幕长宽比与标准长宽比不一致，则依据屏幕长宽比、标准长宽比以及预设布局模板所包括的界面元素数量，调整待显示页面的页面布局，以适配当前屏幕进行显示。

在本发明具体实施例中，在不区分当前屏幕的屏幕长宽比和/或屏幕分辨率的情况下，若当前屏幕直接按照预设页面布局模板进行页面显示，则可能存在预设页面布局模板与当前屏幕不适配的情况，进而导致当前屏幕中出现空白或显示不完整的现象。因此，若屏幕长宽比与标准长宽比不一致，则有必要对预设页面布局模板中的布局细节进行调整，例如对各界面元素之间间隔距离的调整，以及对各界面元素尺寸及其显示内容的调整等，以适配当前屏幕进行显示，使页面显示更加协调。

其中，界面元素是指可满足交互需求的软件或系统界面所包含的满足用户交互要求的一系列元素，例如窗口、对话框、菜单、滚动条以及图形等界面元素。预设布局模板所包括的界面元素数量可以是指预设布局模板中所包括的所有界面元素的数量，也可以为预设布局模板中纵向排列的界面元素的数据。

具体的，根据屏幕长宽比和标准长宽比，可以通过比例关系推导，在当前屏幕与预设布局模板的横向长度比例相同的情况下，确定当前屏幕与预设布局模板的纵向长度比例差值。或者，根据屏幕分辨率或标准分辨率，在当前屏幕与预设布局模板的横向像素数量相同的情况下，确定当前屏幕与预设布局模板的纵向像素数量差值。并根据预设布局模板所包括的界面元素数量，确定预设布局模板中各界面元素之间的纵向间隔的数量。从而依据纵向长度比例差值或纵向像素数量差值，以及纵向间隔的数量，基于预设布局模板对待显示页面的页面布局进行调整，以对预设布局模板进行各界面元素之间的纵向间隔的拉伸或压缩，其中还可以对各界面元素的尺寸及其显示内容进行调整，实现将待显示页面充满当前屏幕进行显示，和/或将待显示页面完整的显示在当前屏幕中。

下面以一个示例进行说明：

图2为页面布局调整的示例图。假设应用程序在开发时，针对当前主流手机屏幕进行页面布局设计，即预设布局模板基于手机屏幕长宽比为16:9或屏幕分辨率为1080×1920适配设计，如图2左图所示。若当前屏幕的屏幕长宽比为19:9或屏幕分辨率为1080×2280，则当前屏幕相对于预设布局模板所适配的屏幕而言，屏幕的横向长度或横向像素数量相同，而当前屏幕的纵向长度比预设布局模板所适配的屏幕的纵向长度长，即可以将集成当前屏幕的手机称为长屏手机。则在长屏手机即将显示待显示页面时，若按照预设布局模板直接显示，则显示页面如图2中间图所示，长屏手机屏幕界面下方出现大量空白。进而本实施例获取待显示页面关联的预设布局模板，通过当前屏幕的屏幕长宽比与标准长宽比的比较，即屏幕长宽比为19:9与标准长宽比16:9不一致，确定在页面布局适配调整后才能够正常显示。

因此，基于当前屏幕与预设布局模板的横向长度比例相同的情况下，确定当前屏幕与预设布局模板的纵向长度比例差值为3。其中，如图2所示，假设预设布局模板中的纵向界面元素数量为5，则确定预设布局模板中包括的纵向间隔为4个。则将纵向长度比例差值平均配置在各个纵向间隔的间隔距离中，即将长屏手机的纵向长度的[(1/19)*(3/4)]的长度分别配置在各个纵向间隔的间隔距离中。或者，基于当前屏幕与预设布局模板的横向像素数量相同的情况下，确定当前屏幕与预设布局模板的纵向像素数量差值为360。则将纵向像素数量差值平均配置在各个纵向间隔的间隔距离中，即将90行像素分别配置在各个纵向间隔的间隔距离中。最终基于调整后的页面布局进行显示如图2右图所示，以此拉伸长屏手机中各界面元素之间间隔的距离，以使待显示页面充满于长屏手机中显示。

值得注意的是，上述示例只是对本方案实现效果的举例性说明，而不限制不方案的具体实现方式，且具体实现方式不局限于此。

此外，本实施例还可以根据各界面元素显示内容的重要程度以及吸引用户程度等评价因素，预先为各界面元素设置显示等级。从而在页面布局调整时，根据各界面元素的显示等级，为各界面元素相邻的至少一个纵向间隔设置权重，并依据纵向长度比例差值或纵向像素数量差值，以及纵向间隔数量和各纵向间隔的权重，调整初始页面布局模板中各界面元素之间纵向间隔的间隔距离。其中，本实施例还可以预先设置纵向间隔的下限距离阈值和/或上限距离阈值，在纵向间隔调整后，若存在纵向间隔的间隔距离超过下限距离阈值和/或上限距离阈值，则可以对对应界面元素的纵向尺寸进行调整，并适应性调整其中的显示内容。

本实施例在检测屏幕长宽比与标准长宽比一致的情况下，则可以确定当前屏幕的屏幕分辨率与标准分辨率之间的全屏缩放比例；按照全屏缩放比例对预设布局模板进行缩放处理，确定当前页面布局模板，以适配当前屏幕进行显示。

根据本实施例提供的屏幕适配显示方法，可以在进行页面显示之前，获取待显示页面的预设页面布局模板，通过对当前屏幕的屏幕长宽比与预设布局模板关联适配的标准屏幕长宽比进行比较，在确定不一致时，基于当前屏幕的屏幕长宽比、预设布局模板关联适配的标准长宽比以及预设布局模板所包括的界面元素数量，对待显示页面的页面布局进行调整，以适配当前屏幕进行显示。利用本实施例的屏幕适配显示方法，可以在页面布局模板与当前屏幕不适配的情况下，通过对页面布局的调整，实现了待显示页面在当前屏幕的适配显示，避免了页面中出现大量空白或不能完全显示的现象，从而提高了页面信息显示的有效性、页面显示的美观性以及不同屏幕规格智能设备所属用户的用户体验。

实施例二

图3示出了本发明实施例二提供的一种屏幕适配显示方法的流程图，本实施例应用于调整页面布局以适配屏幕显示的场景。其中，所述依据所述屏幕长宽比、所述标准长宽比以及所述预设布局模板所包括的界面元素数量，调整待显示页面的页面布局，包括：基于所述预设布局模板关联的标准分辨率的横向分辨率，确定所述当前屏幕的屏幕分辨率相对于所述标准分辨率的纵向分辨率差值；依据所述预设布局模板以及所述界面元素数量，确定待显示页面中各界面元素之间的纵向间隔数量；依据所述纵向分辨率差值以及所述纵向间隔数量，调整所述待显示页面的页面布局。如图3所示，该方法包括：

步骤S301，获取当前屏幕待显示页面的预设布局模板。

步骤S302，检测当前屏幕的屏幕长宽比与预设布局模板的标准长宽比是否一致。

步骤S303，若屏幕长宽比与标准长宽比不一致，则基于预设布局模板关联的标准分辨率的横向分辨率，确定当前屏幕的屏幕分辨率相对于标准分辨率的纵向分辨率差值。

在本发明具体实施例中，基于预设布局模板关联的标注分辨率，无论当前屏幕的屏幕分辨率在纵向和/或横向上存在任何差异，本实施例优选于，通过比例的变化优先将当前屏幕分辨率的横向分辨率与标准分辨率的横向分辨率调整一致的情况下，确定当前屏幕分辨率的纵向分辨率与标准分辨率的纵向分辨率之间的差值，从而将页面布局的调整归结为对预设布局模板中各界面元素之间的纵向间隔的间隔距离进行调整。

可选的，依据当前屏幕的屏幕分辨率以及标准分辨率，确定当前屏幕的横向分辨率与标准分辨率的横向分辨率之间的横向缩放比例；依据横向缩放比例，确定当前屏幕缩放后的纵向分辨率；依据当前屏幕缩放后的纵向分辨率，以及标准分辨率的纵向分辨率，确定纵向分辨率差值。

具体的，横向缩放比例是指当前屏幕的横向分辨率与标准分辨率的横向分辨率之间的缩放比例。本实施例不对屏幕进行调整，而是基于分辨率数值进行推导计算。其中，基于横向缩放比例，当前屏幕缩放后的横向分辨率与标准分辨率的横向分辨率保持一致，进而在横向分辨率相同的情况下，确定当前屏幕的纵向分辨率基于横向缩放比例缩放后的纵向分辨率，并将缩放后的纵向分辨率与标准分辨率的纵向分辨率之间的纵向分辨率差值。

下面仍以上述示例进行说明：

预设布局模板基于手机屏幕分辨率为1080×1920适配设计，即标准分辨率；当前屏幕的屏幕分辨率为1080×2280。则可以确定当前屏幕的横向分辨率1080与标准分辨率的横向分辨率1080之间的横向缩放比例为1。相应的，基于横向缩放比例，确定当前屏幕缩放后的纵向分辨率为2280。进而确定缩放后的纵向分辨率与标准分辨率的纵向分辨率之间的纵向分辨率差值为360。基于上述推导计算过程，可以适用于任何屏幕参数的调整，例如老式手机的屏幕显示或新型手机的屏幕显示等。

步骤S304，依据预设布局模板以及界面元素数量，确定待显示页面中各界面元素之间的纵向间隔数量。

在本发明具体实施例中，界面元素数量可以是指预设布局模板中所包括的所有界面元素的数量，也可以为预设布局模板中纵向排列的界面元素的数据。相邻两个界面元素之间存在间隔，因此根据界面元素数量可以确定待显示页面中各界面元素之间的纵向间隔数量。其中，预设布局模板中各界面元素可能按照一纵列排列，也可能按照至少两个纵列进行排列，或者还可以交替式纵向排列。相应的，不同纵向位置上的间隔数量可能不同，因此可以依据预设布局模板以及界面元素数量，确定各纵向位置上的间隔数量，便于后续对全部纵向间隔进行调整。

步骤S305，依据纵向分辨率差值以及纵向间隔数量，调整待显示页面的页面布局。

在本发明具体实施例中，依据纵向分辨率差值以及纵向间隔数量，基于预设布局模板对待显示页面的页面布局进行调整，以对预设布局模板进行各界面元素之间的纵向间隔的拉伸或压缩，其中还可以对各界面元素的尺寸及其显示内容进行调整，实现将待显示页面充满当前屏幕进行显示，和/或将待显示页面完整的显示在当前屏幕中。

可选的，按照横向缩放比例对预设布局模板进行缩放处理，确定初始页面布局模板，以适配当前屏幕的横向显示；依据纵向分辨率差值以及纵向间隔数量，调整初始页面布局模板中各界面元素之间纵向间隔的间隔距离，确定当前页面布局模板，以适配当前屏幕的纵向显示。

本实施例中，基于推导参数，对预设布局模板本身进行调整，即在保证页面布局横向适配调整的前提下，再对页面布局进行纵向适配调整。因此，首先将页面布局模板按照横向缩放比例进行模板整体的缩放调整，得到初始页面布局模板，以使各界面元素在横向上适配当前屏幕显示。相应的，当前屏幕的纵向上可能存在空白或显示不完整的情况。进而依据纵向分辨率差值以及纵向间隔数量，确定各界面元素之间纵向间隔所需调整的间隔距离，从而得到当前页面布局模板，在纵向上同样适配当前屏幕，以使预设布局模板中的所有界面元素充满显示在当前屏幕中。

具体地，依据所述纵向分辨率差值以及所述纵向间隔数量，调整所述待显示页面的页面布局，可以通过多种方式来实现，本实施例在此以两种较典型的方式进行说明：方式一，将纵向分辨率差值平均配置于各界面元素之间的纵向间隔中；方式二，依据各界面元素的预设显示等级，将纵向分辨率差值加权配置于各界面元素之间的纵向间隔中。

方式一，依据纵向分辨率差值以及纵向间隔数量，确定平均调整距离；依据纵向分辨率差值，若当前屏幕缩放后的纵向分辨率大于标准分辨率的纵向分辨率，则将各界面元素之间纵向间隔的间隔距离调整延长所述平均调整距离，确定当前页面布局模板；或者若当前屏幕缩放后的纵向分辨率小于标准分辨率的纵向分辨率，则将各界面元素之间纵向间隔的间隔距离调整缩减平均调整距离，确定当前页面布局模板。

其中，可以预先确定当前屏幕缩放后的纵向分辨率与标准分辨率的纵向分辨率之间做差顺序，从而根据纵向分辨率差值的正负，确定当前屏幕缩放后的纵向分辨率与标准分辨率的纵向分辨率的大小关系。若当前屏幕缩放后的纵向分辨率大于标准分辨率的纵向分辨率，则对初始页面布局模板中各假面元素之间的纵向间隔进行拉伸处理，即将各纵向间隔的间隔距离均延长平均调整距离，例如上述图2示例中的长屏手机。反之，若当前屏幕缩放后的纵向分辨率小于标准分辨率的纵向分辨率，则对初始页面布局模板中各界面元素之间的纵向间隔进行压缩处理，即将各纵向间隔的间隔距离缩减平均调整距离。如图4所示，图4左图为预设布局模板基于主流手机屏幕长宽比适配设计的页面布局，假设图4中间图为老式手机按照预设布局模板直接显示，则无法依据预设布局模板将待显示页面完全显示出来，因此在横向适配调整后，即预设布局模块的整体比例调整后，将各界面元素之间纵向间隔的间隔距离调整缩减平均调整距离。如图4右图所示。

方式二，依据当前页面布局模板中，各界面元素的显示内容关联的预设显示等级，确定各界面元素相邻的至少一个纵向间隔的权重；依据纵向分辨率差值、纵向间隔数量以及各纵向间隔的权重，调整初始页面布局模板中各界面元素之间纵向间隔的间隔距离，确定当前页面布局模板。

其中，可以根据各界面元素显示内容的重要程度以及吸引用户程度等评价因素，预先为各界面元素设置显示等级。从而在页面布局调整时，根据各界面元素的显示等级，为各界面元素相邻的至少一个纵向间隔设置权重。并依据纵向分辨率差值、纵向间隔数量以及各纵向间隔的权重，确定各纵向间隔的调整距离。最终，同样依据当前屏幕缩放后的纵向分辨率与标准分辨率的纵向分辨率的大小关系，分别对初始页面布局模板中各界面元素之间的纵向间隔进行对应调整。以对显示等级较为重要的界面元素进行突出显示，提高内容的显示效率，吸引更多的用户进行浏览，提高用户体验。

示例性的，图5左图为预设布局模板基于主流手机屏幕长宽比适配设计的页面布局，图5中间图为按照预设布局模板直接显示效果。如图5所示，该页面布局模板中包括5个界面元素。假设第一个界面元素的吸引用户程度最高，则预设第一个界面元素的显示等级为一级。假设第二至四个界面元素中显示内容的重要程度最高，则预设第二至四个界面元素的显示等级为二级，相应的，第五个界面元素的显示等级为三级。其中，一级为最高级，三级为最低级。因此，依据各界面元素的显示内容关联的预设显示等级，可以将第一个界面元素相邻的纵向间隔的权重设置为较大值，将第二至四个界面元素之间的纵向间隔的权重设置为中间值，将第五个界面元素相邻的纵向间隔的权重设置为最小值。进而突出显示能够吸引用户的第一界面元素，其次突出显示内容较为重要的第二至四个界面元素，而第五各界面元素正常显示，如图5右图所示。

其中，本实施例还可以预先设置纵向间隔的下限距离阈值和/或上限距离阈值，在纵向间隔调整后，若存在纵向间隔的间隔距离超过下限距离阈值和/或上限距离阈值，则可以对对应界面元素的纵向尺寸进行调整，并适应性调整其中的显示内容。

可选的，若各纵向间隔的间隔距离小于预设下限距离阈值，则压缩当前页面布局模板中各界面元素的纵向尺寸，并减少各界面元素中的显示内容，以使各纵向间隔的间隔距离不小于预设下限距离阈值。

具体的，预设下限距离阈值是指各界面元素之间纵向间隔的最小间隔距离，当纵向间隔的间隔距离小于预设下限距离阈值时，则不同界面元素之间可能存在重叠现象，如图6左三图所示。因此若各纵向间隔的间隔距离小于预设下限距离阈值，则压缩当前页面布局模板中各界面元素的纵向尺寸，并减少各界面元素中的显示内容，以使各纵向间隔的间隔距离不小于预设下限距离阈值，如图6左四图所示。其中，可以将各纵向间隔的间隔距离调整为预设下限距离阈值的距离大小，或者调整至预设下限距离阈值与预设上限距离阈值之间。

可选的，若各纵向间隔的间隔距离大于预设上限距离阈值，则扩大当前页面布局模板中各界面元素的纵向尺寸，以使各纵向间隔的间隔距离不大于所述预设上限距离阈值。

具体的，预设上限距离阈值是指各界面元素之间纵向间隔的最大间隔距离，当纵向间隔的间隔距离大于预设上限距离阈值时，则各界面元素之间纵向间隔的间隔距离可能存在大量空白，影响页面整体美观效果以及内容显示效率。因此若各纵向间隔的间隔距离大于预设上限距离阈值，则扩大当前页面布局模板中各界面元素的纵向尺寸，以使各纵向间隔的间隔距离不大于所述预设上限距离阈值。其中，可以将各纵向间隔的间隔距离调整为预设上限距离阈值的距离大小，或者调整至预设下限距离阈值与预设上限距离阈值之间。

相应的，在界面元素的纵向尺寸扩大调整后，可以适当增加界面元素中的显示内容。

可选的，依据当前页面布局模板中各界面元素扩大的纵向尺寸，以及当前页面布局模板中各界面元素的显示内容，确定各界面元素关联的潜在显示内容；将潜在显示内容增加显示在关联的界面元素中。

具体的，各界面元素的显示内容可以为文本、图标或图片等各种形式的显示内容。其中，对于受显示区域限制而无法完整显示的内容，例如文本等，则可以依据界面元素扩大的纵向尺寸，确定界面元素关联的潜在显示内容。进而将潜在显示内容增加显示在关联的界面元素中，提高内容显示效率，如图7所示。

根据本实施例提供的屏幕适配显示方法，可以在进行页面显示之前，获取待显示页面的预设页面布局模板，在确定当前屏幕的屏幕长宽比与预设布局模板关联适配的标准屏幕长宽比不一致时，基于当前屏幕的横向分辨率与标准分辨率的横向分辨率一致的情况下，根据当前屏幕的纵向分辨率与标准分辨率的横向分辨率之间的纵向分辨率差值，以及预设布局模板中各界面元素之间纵向间隔的数量，对页面中各界面元素之间纵向间隔的间隔距离进行调整，以适配当前屏幕进行显示。其中，可以根据纵向分辨率差值对各纵向间隔进行平均配置，也可以根据各界面元素的预设显示等级，对各纵向间隔进行加权配置。并对布局调整后的界面元素的纵向尺寸及其显示内容进行适应性调整。利用本实施例的屏幕适配显示方法，可以在页面布局模板与当前屏幕不适配的情况下，通过对页面布局的调整，实现了待显示页面在当前屏幕的适配显示，避免了页面中出现大量空白或不能完全显示的现象，从而提高了页面信息显示的有效性、页面显示的美观性以及不同屏幕规格智能设备所属用户的用户体验。

实施例三

图8示出了本发明实施例三提供的一种屏幕适配显示方法的流程图，本实施例应用于调整页面布局以适配屏幕显示。如图8所示，该方法包括以下步骤：

步骤S801，获取当前屏幕待显示页面的预设布局模板。

步骤S802，检测当前屏幕的屏幕长宽比与预设布局模板的标准长宽比是否一致。

步骤S803，若屏幕长宽比与标准长宽比一致，则确定当前屏幕的屏幕分辨率与标准分辨率之间的全屏缩放比例。

在本发明具体实施例中，由于当前屏幕的屏幕长宽比与标准长宽比一致，则预设布局模板整体缩放后即可适配当前屏幕显示。因此确定当前屏幕的屏幕分辨率与标准分辨率之间的比值即为全屏缩放比例。

步骤S804，按照全屏缩放比例对预设布局模板进行缩放处理，确定当前页面布局模板，以适配当前屏幕进行显示。

在本发明具体实施例中，按照全屏缩放比例对预设布局模板整体进行缩放处理，得到当前页面布局模板，并显示在当前屏幕中。其中，当当前屏幕的屏幕分辨率与标准分辨率相同时，则可以视为全屏缩放比例为1，直接按照预设布局模板进行显示即可。

根据本实施例提供的屏幕适配显示方法，可以在进行页面显示之前，获取待显示页面的预设页面布局模板，在确定当前屏幕的屏幕长宽比与预设布局模板关联适配的标准屏幕长宽比一致时，确定当前屏幕的屏幕分辨率与标准分辨率直接的比值作为全屏缩放比例，根据全屏缩放比例对预设布局模板整体进行缩放处理即可。利用本实施例的屏幕适配显示方法，可以在页面布局模板与当前屏幕不适配的情况下，通过对页面布局的调整，实现了待显示页面在当前屏幕的适配显示，避免了页面中出现大量空白或不能完全显示的现象，从而提高了页面信息显示的有效性、页面显示的美观性以及不同屏幕规格智能设备所属用户的用户体验。

实施例四

本发明实施例四还提供了一种非易失性计算机存储介质，所述计算机存储介质存储有至少一可执行指令，该计算机可执行指令可执行上述任意方法实施例中的屏幕适配显示方法。

可执行指令具体可以用于使得处理器执行以下操作：

获取当前屏幕待显示页面的预设布局模板；

检测所述当前屏幕的屏幕长宽比与所述预设布局模板的标准长宽比是否一致；

若所述屏幕长宽比与所述标准长宽比不一致，则依据所述屏幕长宽比、所述标准长宽比以及所述预设布局模板所包括的界面元素数量，调整待显示页面的页面布局，以适配所述当前屏幕进行显示。

在一种可选的方式中，所述可执行指令还使所述处理器执行以下操作：

基于所述预设布局模板关联的标准分辨率的横向分辨率，确定所述当前屏幕的屏幕分辨率相对于所述标准分辨率的纵向分辨率差值；

依据所述预设布局模板以及所述界面元素数量，确定待显示页面中各界面元素之间的纵向间隔数量；

依据所述纵向分辨率差值以及所述纵向间隔数量，调整所述待显示页面的页面布局。

在一种可选的方式中，所述可执行指令还使所述处理器执行以下操作：

依据所述当前屏幕的屏幕分辨率以及所述标准分辨率，确定当前屏幕的横向分辨率与标准分辨率的横向分辨率之间的横向缩放比例；

依据所述横向缩放比例，确定当前屏幕缩放后的纵向分辨率；

依据所述当前屏幕缩放后的纵向分辨率，以及标准分辨率的纵向分辨率，确定纵向分辨率差值。

在一种可选的方式中，所述可执行指令还使所述处理器执行以下操作：

按照所述横向缩放比例对所述预设布局模板进行缩放处理，确定初始页面布局模板，以适配当前屏幕的横向显示；

依据所述纵向分辨率差值以及所述纵向间隔数量，调整所述初始页面布局模板中各界面元素之间纵向间隔的间隔距离，确定当前页面布局模板，以适配所述当前屏幕的纵向显示。

在一种可选的方式中，所述可执行指令还使所述处理器执行以下操作：

依据所述纵向分辨率差值以及所述纵向间隔数量，确定平均调整距离；

依据所述纵向分辨率差值，若所述当前屏幕缩放后的纵向分辨率大于所述标准分辨率的纵向分辨率，则将所述各界面元素之间纵向间隔的间隔距离调整延长所述平均调整距离，确定当前页面布局模板；或者

若所述当前屏幕缩放后的纵向分辨率小于所述标准分辨率的纵向分辨率，则将所述各界面元素之间纵向间隔的间隔距离调整缩减所述平均调整距离，确定当前页面布局模板。

在一种可选的方式中，所述可执行指令还使所述处理器执行以下操作：

依据所述当前页面布局模板中，各界面元素的显示内容关联的预设显示等级，确定各界面元素相邻的至少一个纵向间隔的权重；

依据所述纵向分辨率差值、所述纵向间隔数量以及各纵向间隔的权重，调整所述初始页面布局模板中各界面元素之间纵向间隔的间隔距离，确定当前页面布局模板。

在一种可选的方式中，所述可执行指令还使所述处理器执行以下操作：

若所述各纵向间隔的间隔距离小于预设下限距离阈值，则压缩当前页面布局模板中各界面元素的纵向尺寸，并减少各界面元素中的显示内容，以使各纵向间隔的间隔距离不小于所述预设下限距离阈值；或者

若所述各纵向间隔的间隔距离大于预设上限距离阈值，则扩大所述当前页面布局模板中各界面元素的纵向尺寸，以使各纵向间隔的间隔距离不大于所述预设上限距离阈值。

在一种可选的方式中，所述可执行指令还使所述处理器执行以下操作：

依据所述当前页面布局模板中各界面元素扩大的纵向尺寸，以及所述当前页面布局模板中各界面元素的显示内容，确定各界面元素关联的潜在显示内容；

将所述潜在显示内容增加显示在关联的界面元素中。

在一种可选的方式中，所述可执行指令还使所述处理器执行以下操作：

若所述屏幕长宽比与所述标准长宽比一致，则确定所述当前屏幕的屏幕分辨率与所述标准分辨率之间的全屏缩放比例；

按照所述全屏缩放比例对所述预设布局模板进行缩放处理，确定当前页面布局模板，以适配所述当前屏幕进行显示。

实施例五

图9示出了根据本发明实施例五提供的一种电子设备的结构示意图，本发明具体实施例并不对电子设备的具体实现做限定。

如图9所示，该电子设备可以包括：处理器(processor)902、通信接口(Communications Interface)904、存储器(memory)906、以及通信总线908。

其中：

处理器902、通信接口904、以及存储器906通过通信总线908完成相互间的通信。

通信接口904，用于与其它设备比如客户端或其它服务器等的网元通信。

处理器902，用于执行程序910，具体可以执行上述屏幕适配显示方法实施例中的相关步骤。

具体地，程序910可以包括程序代码，该程序代码包括计算机操作指令。

处理器902可能是中央处理器CPU，或者是特定集成电路ASIC(ApplicationSpecific Integrated Circuit)，或者是被配置成实施本发明实施例的一个或多个集成电路。电子设备包括的一个或多个处理器，可以是同一类型的处理器，如一个或多个CPU；也可以是不同类型的处理器，如一个或多个CPU以及一个或多个ASIC。

存储器906，用于存放程序910。存储器906可能包含高速RAM存储器，也可能还包括非易失性存储器(non-volatile memory)，例如至少一个磁盘存储器。

程序910具体可以用于使得处理器902执行以下操作：

获取当前屏幕待显示页面的预设布局模板；

检测所述当前屏幕的屏幕长宽比与所述预设布局模板的标准长宽比是否一致；

若所述屏幕长宽比与所述标准长宽比不一致，则依据所述屏幕长宽比、所述标准长宽比以及所述预设布局模板所包括的界面元素数量，调整待显示页面的页面布局，以适配所述当前屏幕进行显示。

在一种可选的方式中，程序910具体还可以用于使得处理器902执行以下操作：

基于所述预设布局模板关联的标准分辨率的横向分辨率，确定所述当前屏幕的屏幕分辨率相对于所述标准分辨率的纵向分辨率差值；

依据所述预设布局模板以及所述界面元素数量，确定待显示页面中各界面元素之间的纵向间隔数量；

依据所述纵向分辨率差值以及所述纵向间隔数量，调整所述待显示页面的页面布局。

在一种可选的方式中，程序910具体还可以用于使得处理器902执行以下操作：

依据所述当前屏幕的屏幕分辨率以及所述标准分辨率，确定当前屏幕的横向分辨率与标准分辨率的横向分辨率之间的横向缩放比例；

依据所述横向缩放比例，确定当前屏幕缩放后的纵向分辨率；

依据所述当前屏幕缩放后的纵向分辨率，以及标准分辨率的纵向分辨率，确定纵向分辨率差值。

在一种可选的方式中，程序910具体还可以用于使得处理器902执行以下操作：

按照所述横向缩放比例对所述预设布局模板进行缩放处理，确定初始页面布局模板，以适配当前屏幕的横向显示；

依据所述纵向分辨率差值以及所述纵向间隔数量，调整所述初始页面布局模板中各界面元素之间纵向间隔的间隔距离，确定当前页面布局模板，以适配所述当前屏幕的纵向显示。

在一种可选的方式中，程序910具体还可以用于使得处理器902执行以下操作：

依据所述纵向分辨率差值以及所述纵向间隔数量，确定平均调整距离；

依据所述纵向分辨率差值，若所述当前屏幕缩放后的纵向分辨率大于所述标准分辨率的纵向分辨率，则将所述各界面元素之间纵向间隔的间隔距离调整延长所述平均调整距离，确定当前页面布局模板；或者

若所述当前屏幕缩放后的纵向分辨率小于所述标准分辨率的纵向分辨率，则将所述各界面元素之间纵向间隔的间隔距离调整缩减所述平均调整距离，确定当前页面布局模板。

在一种可选的方式中，程序910具体还可以用于使得处理器902执行以下操作：

依据所述当前页面布局模板中，各界面元素的显示内容关联的预设显示等级，确定各界面元素相邻的至少一个纵向间隔的权重；

依据所述纵向分辨率差值、所述纵向间隔数量以及各纵向间隔的权重，调整所述初始页面布局模板中各界面元素之间纵向间隔的间隔距离，确定当前页面布局模板。

在一种可选的方式中，程序910具体还可以用于使得处理器902执行以下操作：

若所述各纵向间隔的间隔距离小于预设下限距离阈值，则压缩当前页面布局模板中各界面元素的纵向尺寸，并减少各界面元素中的显示内容，以使各纵向间隔的间隔距离不小于所述预设下限距离阈值；或者

若所述各纵向间隔的间隔距离大于预设上限距离阈值，则扩大所述当前页面布局模板中各界面元素的纵向尺寸，以使各纵向间隔的间隔距离不大于所述预设上限距离阈值。

在一种可选的方式中，程序910具体还可以用于使得处理器902执行以下操作：

依据所述当前页面布局模板中各界面元素扩大的纵向尺寸，以及所述当前页面布局模板中各界面元素的显示内容，确定各界面元素关联的潜在显示内容；

将所述潜在显示内容增加显示在关联的界面元素中。

在一种可选的方式中，程序910具体还可以用于使得处理器902执行以下操作：

若所述屏幕长宽比与所述标准长宽比一致，则确定所述当前屏幕的屏幕分辨率与所述标准分辨率之间的全屏缩放比例；

按照所述全屏缩放比例对所述预设布局模板进行缩放处理，确定当前页面布局模板，以适配所述当前屏幕进行显示。

在此提供的算法和显示不与任何特定计算机、虚拟系统或者其它设备固有相关。各种通用系统也可以与基于在此的示教一起使用。根据上面的描述，构造这类系统所要求的结构是显而易见的。此外，本发明实施例也不针对任何特定编程语言。应当明白，可以利用各种编程语言实现在此描述的本发明实施例的内容，并且上面对特定语言所做的描述是为了披露本发明实施例的最佳实施方式。

在此处所提供的说明书中，说明了大量具体细节。然而，能够理解，本发明的实施例可以在没有这些具体细节的情况下实践。在一些实例中，并未详细示出公知的方法、结构和技术，以便不模糊对本说明书的理解。

类似地，应当理解，为了精简本公开并帮助理解各个发明方面中的一个或多个，在上面对本发明的示例性实施例的描述中，本发明实施例的各个特征有时被一起分组到单个实施例、图、或者对其的描述中。然而，并不应将该公开的方法解释成反映如下意图：即所要求保护的本发明要求比在每个权利要求中所明确记载的特征更多的特征。更确切地说，如下面的权利要求书所反映的那样，发明方面在于少于前面公开的单个实施例的所有特征。因此，遵循具体实施方式的权利要求书由此明确地并入该具体实施方式，其中每个权利要求本身都作为本发明的单独实施例。

本领域那些技术人员可以理解，可以对实施例中的设备中的模块进行自适应性地改变并且把它们设置在与该实施例不同的一个或多个设备中。可以把实施例中的模块或单元或组件组合成一个模块或单元或组件，以及此外可以把它们分成多个子模块或子单元或子组件。除了这样的特征和/或过程或者单元中的至少一些是相互排斥之外，可以采用任何组合对本说明书(包括伴随的权利要求、摘要和附图)中公开的所有特征以及如此公开的任何方法或者设备的所有过程或单元进行组合。除非另外明确陈述，本说明书(包括伴随的权利要求、摘要和附图)中公开的每个特征可以由提供相同、等同或相似目的的替代特征来代替。

此外，本领域的技术人员能够理解，尽管在此所述的一些实施例包括其它实施例中所包括的某些特征而不是其它特征，但是不同实施例的特征的组合意味着处于本发明的范围之内并且形成不同的实施例。例如，在下面的权利要求书中，所要求保护的实施例的任意之一都可以以任意的组合方式来使用。

应该注意的是上述实施例对本发明进行说明而不是对本发明进行限制，并且本领域技术人员在不脱离所附权利要求的范围的情况下可设计出替换实施例。在权利要求中，不应将位于括号之间的任何参考符号构造成对权利要求的限制。单词“包含”不排除存在未列在权利要求中的元件或步骤。位于元件之前的单词“一”或“一个”不排除存在多个这样的元件。本发明实施例可以借助于包括有若干不同元件的硬件以及借助于适当编程的计算机来实现。单词第一、第二、以及第三等的使用不表示任何顺序。可将这些单词解释为名称。

Claims (21)

1.一种屏幕适配显示方法，用于调整页面布局以适配屏幕显示，其中，所述方法包括：

获取当前屏幕待显示页面的预设布局模板；

检测所述当前屏幕的屏幕长宽比与所述预设布局模板的标准长宽比是否一致；

若所述屏幕长宽比与所述标准长宽比不一致，则依据所述屏幕长宽比、所述标准长宽比以及所述预设布局模板所包括的界面元素数量，调整待显示页面的页面布局，以适配所述当前屏幕进行显示；

其中，所述依据所述屏幕长宽比、所述标准长宽比以及所述预设布局模板所包括的界面元素数量，调整待显示页面的页面布局，包括：

依据所述当前屏幕的屏幕分辨率以及标准分辨率，确定当前屏幕的横向分辨率与标准分辨率的横向分辨率之间的横向缩放比例；其中，所述标准分辨率是预设布局模板所适配的屏幕分辨率；

依据所述横向缩放比例，确定当前屏幕缩放后的纵向分辨率；

依据所述当前屏幕缩放后的纵向分辨率，以及标准分辨率的纵向分辨率，确定纵向分辨率差值；

依据所述预设布局模板以及所述界面元素数量，确定待显示页面中各界面元素之间的纵向间隔数量；

依据所述纵向分辨率差值以及所述纵向间隔数量，调整所述待显示页面的页面布局。

2.根据权利要求1所述的方法，其中，所述依据所述纵向分辨率差值以及所述纵向间隔数量，调整所述待显示页面的页面布局，包括：

按照所述横向缩放比例对所述预设布局模板进行缩放处理，确定初始页面布局模板，以适配当前屏幕的横向显示；

依据所述纵向分辨率差值以及所述纵向间隔数量，调整所述初始页面布局模板中各界面元素之间纵向间隔的间隔距离，确定当前页面布局模板，以适配所述当前屏幕的纵向显示。

3.根据权利要求2所述的方法，其中，所述依据所述纵向分辨率差值以及所述纵向间隔数量，调整所述初始页面布局模板中各界面元素之间纵向间隔的间隔距离，确定当前页面布局模板，包括：

依据所述纵向分辨率差值以及所述纵向间隔数量，确定平均调整距离；

依据所述纵向分辨率差值，若所述当前屏幕缩放后的纵向分辨率大于所述标准分辨率的纵向分辨率，则将所述各界面元素之间纵向间隔的间隔距离调整延长所述平均调整距离，确定当前页面布局模板；或者

若所述当前屏幕缩放后的纵向分辨率小于所述标准分辨率的纵向分辨率，则将所述各界面元素之间纵向间隔的间隔距离调整缩减所述平均调整距离，确定当前页面布局模板。

4.根据权利要求2所述的方法，其中，所述依据所述纵向分辨率差值以及所述纵向间隔数量，调整所述初始页面布局模板中各界面元素之间纵向间隔的间隔距离，确定当前页面布局模板，包括：

依据所述当前页面布局模板中，各界面元素的显示内容关联的预设显示等级，确定各界面元素相邻的至少一个纵向间隔的权重；

依据所述纵向分辨率差值、所述纵向间隔数量以及各纵向间隔的权重，调整所述初始页面布局模板中各界面元素之间纵向间隔的间隔距离，确定当前页面布局模板。

5.根据权利要求2-4中任一项所述的方法，其中，在所述依据所述纵向分辨率差值以及所述纵向间隔数量，调整所述初始页面布局模板中各界面元素之间纵向间隔的间隔距离，确定当前页面布局模板之后，还包括：

若所述各纵向间隔的间隔距离小于预设下限距离阈值，则压缩当前页面布局模板中各界面元素的纵向尺寸，并减少各界面元素中的显示内容，以使各纵向间隔的间隔距离不小于所述预设下限距离阈值；或者

若所述各纵向间隔的间隔距离大于预设上限距离阈值，则扩大所述当前页面布局模板中各界面元素的纵向尺寸，以使各纵向间隔的间隔距离不大于所述预设上限距离阈值。

6.根据权利要求5所述的方法，其中，在所述扩大所述当前页面布局模板中各界面元素的纵向尺寸之后，还包括：

依据所述当前页面布局模板中各界面元素扩大的纵向尺寸，以及所述当前页面布局模板中各界面元素的显示内容，确定各界面元素关联的潜在显示内容；

将所述潜在显示内容增加显示在关联的界面元素中。

7.根据权利要求1所述的方法，其中，在所述检测所述当前屏幕的屏幕长宽比与所述预设布局模板的标准长宽比是否一致之后，还包括：

若所述屏幕长宽比与所述标准长宽比一致，则确定所述当前屏幕的屏幕分辨率与所述标准分辨率之间的全屏缩放比例；

按照所述全屏缩放比例对所述预设布局模板进行缩放处理，确定当前页面布局模板，以适配所述当前屏幕进行显示。

8.一种电子设备，包括：处理器、存储器、通信接口和通信总线，所述处理器、所述存储器和所述通信接口通过所述通信总线完成相互间的通信；

所述存储器用于存放至少一可执行指令，所述可执行指令使所述处理器执行以下操作：

获取当前屏幕待显示页面的预设布局模板；

检测所述当前屏幕的屏幕长宽比与所述预设布局模板的标准长宽比是否一致；

若所述屏幕长宽比与所述标准长宽比不一致，则依据所述屏幕长宽比、所述标准长宽比以及所述预设布局模板所包括的界面元素数量，调整待显示页面的页面布局，以适配所述当前屏幕进行显示；

其中，所述依据所述屏幕长宽比、所述标准长宽比以及所述预设布局模板所包括的界面元素数量，调整待显示页面的页面布局，包括：

依据所述当前屏幕的屏幕分辨率以及标准分辨率，确定当前屏幕的横向分辨率与标准分辨率的横向分辨率之间的横向缩放比例；其中，所述标准分辨率是预设布局模板所适配的屏幕分辨率；

依据所述横向缩放比例，确定当前屏幕缩放后的纵向分辨率；

依据所述当前屏幕缩放后的纵向分辨率，以及标准分辨率的纵向分辨率，确定纵向分辨率差值；

依据所述预设布局模板以及所述界面元素数量，确定待显示页面中各界面元素之间的纵向间隔数量；

依据所述纵向分辨率差值以及所述纵向间隔数量，调整所述待显示页面的页面布局。

9.根据权利要求8所述的电子设备，所述可执行指令还使所述处理器执行以下操作：

按照所述横向缩放比例对所述预设布局模板进行缩放处理，确定初始页面布局模板，以适配当前屏幕的横向显示；

依据所述纵向分辨率差值以及所述纵向间隔数量，调整所述初始页面布局模板中各界面元素之间纵向间隔的间隔距离，确定当前页面布局模板，以适配所述当前屏幕的纵向显示。

10.根据权利要求9所述的电子设备，所述可执行指令还使所述处理器执行以下操作：

依据所述纵向分辨率差值以及所述纵向间隔数量，确定平均调整距离；

依据所述纵向分辨率差值，若所述当前屏幕缩放后的纵向分辨率大于所述标准分辨率的纵向分辨率，则将所述各界面元素之间纵向间隔的间隔距离调整延长所述平均调整距离，确定当前页面布局模板；或者

若所述当前屏幕缩放后的纵向分辨率小于所述标准分辨率的纵向分辨率，则将所述各界面元素之间纵向间隔的间隔距离调整缩减所述平均调整距离，确定当前页面布局模板。

11.根据权利要求9所述的电子设备，所述可执行指令还使所述处理器执行以下操作：

依据所述当前页面布局模板中，各界面元素的显示内容关联的预设显示等级，确定各界面元素相邻的至少一个纵向间隔的权重；

依据所述纵向分辨率差值、所述纵向间隔数量以及各纵向间隔的权重，调整所述初始页面布局模板中各界面元素之间纵向间隔的间隔距离，确定当前页面布局模板。

12.根据权利要求9-11中任一项所述的电子设备，所述可执行指令还使所述处理器执行以下操作：

若所述各纵向间隔的间隔距离小于预设下限距离阈值，则压缩当前页面布局模板中各界面元素的纵向尺寸，并减少各界面元素中的显示内容，以使各纵向间隔的间隔距离不小于所述预设下限距离阈值；或者

若所述各纵向间隔的间隔距离大于预设上限距离阈值，则扩大所述当前页面布局模板中各界面元素的纵向尺寸，以使各纵向间隔的间隔距离不大于所述预设上限距离阈值。

13.根据权利要求12所述的电子设备，所述可执行指令还使所述处理器执行以下操作：

依据所述当前页面布局模板中各界面元素扩大的纵向尺寸，以及所述当前页面布局模板中各界面元素的显示内容，确定各界面元素关联的潜在显示内容；

将所述潜在显示内容增加显示在关联的界面元素中。

14.根据权利要求8所述的电子设备，所述可执行指令还使所述处理器执行以下操作：

若所述屏幕长宽比与所述标准长宽比一致，则确定所述当前屏幕的屏幕分辨率与所述标准分辨率之间的全屏缩放比例；

按照所述全屏缩放比例对所述预设布局模板进行缩放处理，确定当前页面布局模板，以适配所述当前屏幕进行显示。

15.一种计算机存储介质，所述存储介质中存储有至少一可执行指令，所述可执行指令使处理器执行以下操作：

获取当前屏幕待显示页面的预设布局模板；

检测所述当前屏幕的屏幕长宽比与所述预设布局模板的标准长宽比是否一致；

若所述屏幕长宽比与所述标准长宽比不一致，则依据所述屏幕长宽比、所述标准长宽比以及所述预设布局模板所包括的界面元素数量，调整待显示页面的页面布局，以适配所述当前屏幕进行显示；

其中，所述依据所述屏幕长宽比、所述标准长宽比以及所述预设布局模板所包括的界面元素数量，调整待显示页面的页面布局，包括：

依据所述当前屏幕的屏幕分辨率以及标准分辨率，确定当前屏幕的横向分辨率与标准分辨率的横向分辨率之间的横向缩放比例；其中，所述标准分辨率是预设布局模板所适配的屏幕分辨率；

依据所述横向缩放比例，确定当前屏幕缩放后的纵向分辨率；

依据所述当前屏幕缩放后的纵向分辨率，以及标准分辨率的纵向分辨率，确定纵向分辨率差值；

依据所述预设布局模板以及所述界面元素数量，确定待显示页面中各界面元素之间的纵向间隔数量；

依据所述纵向分辨率差值以及所述纵向间隔数量，调整所述待显示页面的页面布局。

16.根据权利要求15所述的计算机存储介质，所述可执行指令还使所述处理器执行以下操作：

按照所述横向缩放比例对所述预设布局模板进行缩放处理，确定初始页面布局模板，以适配当前屏幕的横向显示；

依据所述纵向分辨率差值以及所述纵向间隔数量，调整所述初始页面布局模板中各界面元素之间纵向间隔的间隔距离，确定当前页面布局模板，以适配所述当前屏幕的纵向显示。

17.根据权利要求16所述的计算机存储介质，所述可执行指令还使所述处理器执行以下操作：

依据所述纵向分辨率差值以及所述纵向间隔数量，确定平均调整距离；

依据所述纵向分辨率差值，若所述当前屏幕缩放后的纵向分辨率大于所述标准分辨率的纵向分辨率，则将所述各界面元素之间纵向间隔的间隔距离调整延长所述平均调整距离，确定当前页面布局模板；或者

若所述当前屏幕缩放后的纵向分辨率小于所述标准分辨率的纵向分辨率，则将所述各界面元素之间纵向间隔的间隔距离调整缩减所述平均调整距离，确定当前页面布局模板。

18.根据权利要求16所述的计算机存储介质，所述可执行指令还使所述处理器执行以下操作：

依据所述当前页面布局模板中，各界面元素的显示内容关联的预设显示等级，确定各界面元素相邻的至少一个纵向间隔的权重；

依据所述纵向分辨率差值、所述纵向间隔数量以及各纵向间隔的权重，调整所述初始页面布局模板中各界面元素之间纵向间隔的间隔距离，确定当前页面布局模板。

19.根据权利要求16-18中任一项所述的计算机存储介质，所述可执行指令还使所述处理器执行以下操作：

若所述各纵向间隔的间隔距离小于预设下限距离阈值，则压缩当前页面布局模板中各界面元素的纵向尺寸，并减少各界面元素中的显示内容，以使各纵向间隔的间隔距离不小于所述预设下限距离阈值；或者

若所述各纵向间隔的间隔距离大于预设上限距离阈值，则扩大所述当前页面布局模板中各界面元素的纵向尺寸，以使各纵向间隔的间隔距离不大于所述预设上限距离阈值。

20.根据权利要求19所述的计算机存储介质，所述可执行指令还使所述处理器执行以下操作：

依据所述当前页面布局模板中各界面元素扩大的纵向尺寸，以及所述当前页面布局模板中各界面元素的显示内容，确定各界面元素关联的潜在显示内容；

将所述潜在显示内容增加显示在关联的界面元素中。

21.根据权利要求15所述的计算机存储介质，所述可执行指令还使所述处理器执行以下操作：

若所述屏幕长宽比与所述标准长宽比一致，则确定所述当前屏幕的屏幕分辨率与所述标准分辨率之间的全屏缩放比例；

按照所述全屏缩放比例对所述预设布局模板进行缩放处理，确定当前页面布局模板，以适配所述当前屏幕进行显示。